オープンソースWebDBのプリザンター(pleasanter)ブログ

オープンソースのWebDBのプリザンター(pleasanter)のブログです

オープンソースWebDB「プリザンター」のブログです。 機能の紹介や実例を交え、わかりやすく解説していきます。

プリザンターのカスタム項目(4) ~カスタム項目「分類」のリスト形式の設定方法(1)

こんにちは、リーデックス板垣です。

今回はプリザンターのカスタム項目「分類」のリスト形式でのエディト・表示についてみていきたいと思います。

リスト形式の作成方法5つ

以前「プリザンターのカスタム項目① ~プリザンターのカスタム項目とは?どんな種類があるの?」で軽く触れましたが、プリザンターのカスタム項目「分類」のリスト形式の作成方法には5つの方法があります。

  • 詳細設定の選択肢一覧に記載する
  • 連携したWikiの分類項目を利用する
  • 連携した記録テーブルのタイトルを利用する
  • 連携した期限付きテーブルのタイトルを利用する
  • 管理しているユーザ名を利用する

今回は「詳細設定の選択肢一覧に記載する」方法をみていきます。

続きを読む

プリザンターのカスタム項目(3) ~カスタム項目を一覧上に表示させてみよう

こんにちは、リーデックス板垣です。前回に引き続き、プリザンターのカスタム項目「分類」について見て行きます。

前回のあらすじ
カスタム項目「分類」の有効化と、「顧客名」への変更に成功した我々だったが、しかし、一覧表示には表示されていなかった……。

実は一覧表示には一覧表示に何が表示されるかの設定が必要です。その手順をみていきましょう。

続きを読む

プリザンターのカスタム項目(2) ~分類項目の詳細設定をしてみよう

こんにちは。リーデックス板垣です。

前回、カスタム項目の有効化までを見ましたので、今回は具体的なカスタム項目の設定方法ということで、「分類」項目の詳細設定を見ていきます。

続きを読む

プリザンターのカスタム項目(1) ~カスタム項目って何? どんな種類があるの?

 こんにちは。リーデックス板垣です。

今回はプリザンターのカスタム項目についてみていきたいと思います。

プリザンターにはデフォルトで設定されている項目の他に、6種類×27、合計162項目のカスタム項目を設定することが出来ます。

これにより、業務に合わせた柔軟なカスタマイズが可能になります。

また、カスタム項目を設定することで既存の表計算ソフトからプリザンターへの移行をスムーズに実施することができます。

では、カスタム項目の設定方法をみていきましょう。

続きを読む

新機能「API」をさっくりと試してみた③~解決!!

※以下の情報は2019/01/22現在では古い情報となっており、URLを/pleasanter/api/items/xxxxの形式にすることで「content-type」が"aplication/json"でも動作するようになっております。

詳しくはプリザンターマニュアルをご確認ください!(今後、新しく記事を作成する予定です)

API機能:レコード操作:複数取得 · Implem/Implem.Pleasanter Wiki · GitHub

 

-----------------------------------------------------------

こんにちわ。リーデックス小川です。

ついに解決しました!クライアントのJavaScriptからプリザンターへの投稿ができるようになりました。ポイントは「content-type」の設定でした。では、早速書いて行きたいと思います。

 

HTMLソース 

今回利用したソースは下記となります。ロジックに大きく関係しない多少の変更をしましたが、前回のものとほとんど一緒です。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTMLからプリザンターのAPIを利用してデータを登録する</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script type="text/javascript">
	$(function(){
		$("#response").html("Response Values");

		$("#button").click( function(){
			var url = $("#url_post").val();
			var method_name = $("#method_name").val();

			var JSONdata = {
			ApiKey: "APKキーを設定",
			Title: $("#value1").val(),
			CompletionTime: "2018/3/31"
			};

			alert(JSON.stringify(JSONdata));

			$.ajax({
				type : method_name,
				url : url,
				data : JSON.stringify(JSONdata),
				//contentType: 'application/json',
				contentType: 'application/x-www-form-urlencoded',
				dataType : 'json',
				scriptCharset: 'utf-8',
				success : function(data) {

					// Success
					alert("success");
					alert(JSON.stringify(data));
					$("#response").html(JSON.stringify(data));
				},
				error : function(data) {

					// Error
					alert("error");
					alert(JSON.stringify(data));
					$("#response").html(JSON.stringify(data));
				}
			});
		})
	})
</script>
</head>
<body>
	<h1>HTMLファイルからPOSTでJSONデータを送信する</h1>
	<p>URL: <input type="text" id="url_post" name="url" size="100" value="http://localhost/pleasanter/api_items/278/create"><br/>
	<p>Method: <input type="text" id="method_name" name="method_name" size="100" value="POST"><br/>
	<p>Title <input type="text" id="value1" size="30" value="値1"></p>
	<p><button id="button" type="button">submit</button></p>
	<textarea id="response" cols=120 rows=10 disabled></textarea>
</body>
</html>

 

 

ここで、Ajaxの設定「 contentType 」を「 'application/x-www-form-urlencoded'」に設定するすることが必要でした。 GitHubの下記情報をもとにさせてもらいました。有難うございました。

github.com

 

 

PowerShellPHPCurlなどのデフォルトは上記の設定になっているようです(未確認)。詳細は下記をごらんください。

application/x-www-form-urlencoded

application/x-www-form-urlencoded ‐ 通信用語の基礎知識

 

ブラウザでの表示はこのようになります。

f:id:h-ogawa-reedex-co-jp:20180323095939p:plain

 

 

実行してみる 

プリザンターのデフォルトの一覧表示です。

f:id:h-ogawa-reedex-co-jp:20180323100054p:plain

 

 

ブラウザから登録してみます。

f:id:h-ogawa-reedex-co-jp:20180323100154p:plain

f:id:h-ogawa-reedex-co-jp:20180323100222p:plain

f:id:h-ogawa-reedex-co-jp:20180323100236p:plain

 

 

どうやら上手く行ったようです。プリザンター側を見てみましょう。

f:id:h-ogawa-reedex-co-jp:20180323100317p:plain

f:id:h-ogawa-reedex-co-jp:20180323100343p:plain

 

 

ちゃんと入っているみたいですね。これにてAPIについての試してみた、は終わりとさせてもらいます。

 

注意!

APIKeyがさらされるので、本来はこのような使い方はしてはいけません。必ずサーバーサイドのプログラムで実装してください。弊社のセミナーでは、HTML→PHP→プリザンター→Slackまでの一連のながれのデモを行っておりますので、タイミングが合えばぜひご来場ください。

株式会社リーデックス - connpass

 

注意2!

APIを利用する際にHTTPSでも通信は可能のようですが、開発用のオレオレ証明書だとエラーが発生するようです。イメージ情報システム様のブログに記載がありました。

imageinformationsystem.hatenablog.com

新機能の拡張スタイル・スクリプトなどを試してみる。

こんにちわ。リーデックス小川です。

今回は、2017年2月5日(月)に追加された新機能「拡張スタイル」「拡張スクリプト」「画像機能の追加」を試してみたいと思います。「拡張スタイル」「拡張スクリプト」は管理画面のUIがかなり変えることができると思いますので、重要度の高いバージョンアップと思っています。今回は、インストールから簡単なUI変更とスクリプト追加を行ってみようと思います。

続きを読む