Title: DataTables プラグイン

DataTables ロゴ特定の条件で集めた記事（タスク、プロジェクト、予定など）を jQuery DataTables によるテーブル形式（スプレッドシート形式）で表示します。

列として表示する項目のカスタマイズや、行数変更ドロップダウンやフィルターボックスの表示/非表示などを、ウィジェットのオプションで設定できます。

ページ当たりの表示行数変更、並び替え（ソート）、絞り込み（フィルター）、ページ切り替えなどもサポート。

SDL のライブラリとしても使用でき、開発者は、自分のプラグインから当ライブラリを呼び出して利用できます。

関連記事
Forum1404
DocJp1801: セクション テーブル ウィジェット 2.0



動作例



当サポートサイトの最新の投稿 30 件

読み込み中 読み込み中...


ダウンロード



下のリンクをクリックしてプラグインの .zip ファイルをダウンロードします。



インストール



TeamPage にサーバー管理者としてログインし、サーバー セットアップ > プラグイン ページを開き、ページ下部の [新規プラグインのインストール] で .zip ファイルを指定してアップロードします。

アップロードが完了したら、サーバーセットアップ > 一般 > サーバー管理 の [TeamPage の再起動] ボタンをクリックして TeamPage を再起動してください。TeamPage クラウド環境では再起動が 2 回必要ですので、1回目の再起動が完了したら再度 [TeamPage の再起動] ボタンをクリックして 2 度目の再起動を行ってください。

サーバー セットアップ > プラグイン ページ を開き、[DataTables] プラグインが表示されていることを確認します。

インストール完了

以上でインストール作業は完了です。

ウィジェットの使い方



ウィジェットの挿入



記事本文のツールバーの [ウィジェットの挿入/編集] アイコンをクリックして表示されるウィジェットの一覧の中から [DataTables] を選択します。

ウィジェットの挿入/編集

ウィジェットの詳細を選択・記入して [OK] をクリックします。

[ID (DataTable 名)] と [列に表示する項目] は入力必須です。また、[ID (DataTable 名)] に使えるのは半角英数字だけで、スペース（空白文字）や記号などは使えません。

その他、オプションの詳細については後述します。

ウィジェットの設定

記事本文にウィジェットが挿入されたことを確認して記事を投稿（送信）します。

ウィジェットが挿入された

投稿された記事の中に DataTable が表示されます。

テーブルが表示された

挿入されたウィジェットの操作



並び替え（ソート）



見出し行（テーブルの最も上の行）をクリックして並び替えができます。

既定のソート順は、最も左の列を基準にした昇順です。ウィジェットの詳細設定で変更できます。

ページあたりの行数の変更



左上に表示されるドロップダウンリストで、ページあたりの行数を変更できます。

なお、ドロップダウンリストを非表示にしたり、ドロップダウンリストの選択肢や初期値を変更したりできます。詳しくは、後述のウィジェットの詳細設定を参照してください。

操作1

絞り込み（フィルター）



右上の [フィルター] 欄にテキストを入力して絞り込み表示ができます。下図では「期限超過」を入力して締切を過ぎたタスクだけを表示しています。



優先度や担当者で絞り込んだ一覧へのリンク



優先度や担当者のリンクをクリックすると、クリックした内容の絞り込み（フィルター）が適用された状態の記事一覧画面が表示されます。記事ボリュームを変更して一覧を見やすくしたり、まとめて印刷、エクスポートなどができます。

優先度やユーザーの絞り込み

ウィジェットの詳細オプション



タイトル



テーブルの上に表示されるタイトルを指定します。空欄にするとタイトルは表示されません。

ID (DataTable 名)



DataTable に名前をつけます。ここでは半角英数字のみが使え、空白文字（スペース）や記号は使えませんのでご注意ください。

リクエストするスペース



テーブルに表示される記事は、ここで指定されたスペースに投稿されたものが対象になります。

列に表示する項目



列に表示する項目

DataTable の列に表示するエントリー フィールド (Entry Field) の名前を記入します。半角カンマ記号で区切ってください。エントリー フィールドとは、簡単に言うと記事の属性（タイトル、投稿日時、投稿者、担当者、優先度など）のことで、標準で次のものが利用できます。



また、プラグインを導入している場合は、プラグインによって追加されたエントリー フィールドを利用できます。

リクエストの種類



テーブルに表示される記事の集め方を選択します。テーブル表示用の記事を検索する内部処理のリクエスト時に、<entries> SDL タグの type= パラメーターの値として使用されます。

リクエストのタグ



上記 [リクエストの種類] でタグによる方法を選択した場合に使用されるタグ名をここに記入します。

リクエストの検索書式



ここに記入する内容は、テーブル表示用の記事を検索する内部処理のリクエスト時に、<entries> SDL タグの search= パラメーターの値として使用されます。

リクエストの期間範囲



テーブルに表示される記事の期間範囲（投稿日時の期間）を指定します。既定の [all] は「すべての期間」を表します。

リクエストの最大件数



ここに記入する内容は、テーブル表示用の記事を検索する内部処理のリクエスト時に、<entries> SDL タグの max= パラメーターの値として使用されます。

例えば、ここで「15」を指定すると、ヒット件数が「15」に達した時点で記事の取り出しを終了します。仮に、記事が100件あるとすると、初めの15件で終了するので、テーブルに表示されるのは15件（15行）だけになり、残りの85件はテーブルに表示されません。

ソートを有効にする



ここで [いいえ] を選択すると、テーブルのタイトル行をクリックしたときの並び替え（ソート）ができなくなります。

ソートの既定値



ソート（並び替え）順の既定値（デフォルト設定）を選択します。

ソートの既定の基準列番号



ソート（並び替え）の基準となる列の番号を指定します。最も左の列が「0」になります。

フィルター ボックスを表示



テーブルの右上の [フィルター] ボックスを表示するかどうかを選択します。

詳細情報を表示



テーブルの左下の、表示中の件数などの詳細情報を表示するかどうかを選択します。

ページ切り替えを有効にする



テーブルの右下の、ページ切り替えボタンを表示するかどうかを選択します。ここで [いいえ] を選択すると、ページ切り替えは無効になり、該当する記事すべてが 1 ページに表示されます。

表示件数変更ドロップダウンを表示



テーブルの左上の、1 ページあたりの件数を切り替えるドロップダウンを表示するかどうかを選択します。

表示件数変更ドロップダウンの項目



表示件数変更ドロップダウンに表示される選択肢を指定します。既定は「10,25,50,100」です。半角コンマ記号で区切ってください。

ページ毎に表示する行数の初期値



テーブルの左上の、表示件数変更ドロップダウンの初期値を指定します。

状態保存を使用



テーブルの状態（ソート順・フィルター内容・表示ページなど）をブラウザに保存し、ページを再読み込みしたときに復元するかどうかを選択します。既定値は「はい」です。

「はい」を選択すると、別のページへ移動してから戻ったときにも、前の状態でテーブルが表示されます。「いいえ」を選択すると、ページを再読み込みするたびにテーブルの状態が初期値にリセットされます。

プロジェクト（goalid）



特定のプロジェクトに関連する記事だけに絞り込むには、ここにそのプロジェクトの記事 ID（例: SpaceName123）を記入します。

マイルストーン（milestoneid）



特定のマイルストーンに関連する記事だけに絞り込むには、ここにそのマイルストーンの記事 ID（例: SpaceName123）を記入します。

記事 ID（tractionid）



表示する記事の ID を半角コンマ記号で区切って指定します。この設定は、「リクエストの種類」で「multi」を指定した場合にのみ有効です。

記事 FQID（fqid）



表示する記事の FQID（完全修飾 ID）を半角コンマ記号で区切って指定します。この設定は、「リクエストの種類」で「multi」を指定した場合にのみ有効です。

カラム コントロールを使用



「はい」を選択すると、テーブルの各列のヘッダーに列を操作するためのアイコンが表示されます。アイコンをクリックするとドロップダウン パネルが開き、その列を対象とした絞り込みや並び替えができます。

注意：サーバーサイド処理が有効な場合、サーバーサイドでソートできない列（「タイトル」と「作成日時」以外）の並び替えアイコンは非表示になります。

カラム コントロールのドロップダウン パネルの項目



カラム コントロールのドロップダウン パネルに表示される操作の種類を選択します。以下の項目を組み合わせて選択できます。



注意：サーバーサイド処理が有効な場合、「検索 (フィルター)」と「スペーサー」は自動的にドロップダウンから除外されます。

テーブルのスタイル



テーブルに適用するスタイルの種類を選択します。複数選択が可能です。



サーバーサイド処理



「はい」を選択すると、ページ切り替え・検索・並び替えの処理をリクエストごとにサーバーで行います。データ件数が多い場合（数百〜数千件以上）に推奨します。

「いいえ」を選択すると、「リクエストの最大件数」分のデータを一括で読み込み、ブラウザ側で処理します。

サーバーサイド処理が有効な場合の制限事項：



エクスポート ボタンを表示



「はい」を選択すると、テーブルの下にエクスポート用のボタンが表示されます。既定値は「はい」です。

表示されるエクスポート ボタンの種類は、サーバー セットアップ > 設定で変更できます（「エクスポート ボタンの表示選択」）。

フルスクリーン ボタンを表示



「はい」を選択すると、テーブルの下に「全画面表示」ボタンが表示されます。クリックするとテーブルをフルスクリーンで表示できます。

既定値は「いいえ」です。

別タブ表示ボタンを表示



「はい」を選択すると、テーブルの右上に「別タブ表示」ボタンが表示されます。クリックするとテーブルを別タブまたはウィンドウで開け

ます。既定値は「いいえ」です。

カラム検索を表示（列ごとの絞り込み欄）



「はい」を選択すると、各列の上部に検索ボックスが表示され、列単位での絞り込みができます。既定値は「はい」です。

注意：「合計欄を使用」が設定されている場合、合計フッターが優先されるため、カラム検索は自動的に無効になります。また、サーバーサイド処理が有効な場合、この設定にかかわらずカラム検索は表示されません。

合計欄を使用（sum）



各列の数値の合計をテーブルのフッターに表示するには、合計を表示したい列の番号（0 始まり）を半角コンマ記号で区切って指定します。例えば、左から 2 列目と 4 列目に合計を表示する場合は「1,3」と入力します。

注意：この設定を行うと、「カラム検索を表示」は自動的に無効になります。

PDF ドキュメントの向き



エクスポートする PDF ドキュメントの向きを選択します。



エクスポート機能





開発者向けの使い方



テスト表示ビュー



検索ボックスに /type datatables_example を入力して Enter キーを押すと、下図の動作テスト画面が表示され、パラメーターの変更がどのように動作に反映されるのかをこの画面で確認できます。

DataTables テスト表示ビュー

SDL ライブラリとして使用する



セクションタイトル付き



プラグイン中の com/traction/sdl/datatables/parent.sdl の「datatable-section」関数を次の書式で呼び出します。 

<com.traction.sdl.datatables.parent#datatable-section id="foo" proj="*" ... >


セクションタイトルを省略



プラグイン中の com/traction/sdl/datatables/parent.sdl の「datatable-iframe-div」関数を次の書式で呼び出します。 

<com.traction.sdl.datatables.parent#datatable-iframe-div id="foo" proj="*" ... >




Attachments:
plugin_installed.png
widget1.png
widget2.png
widget3.png
widget4.png
widget5.png
widget6.png
widget7.png
DataTables_Example.png
entry_fields.png
datatables_image.png
datatables_logo.png
関連記事
参照されている (6)
DocRingi50: DataTableを使って承認要求の一覧表を作成するDownload2638: TeamPage 6.2.76 アップデートDocRingi31: DataTableを使って稟議記事の一覧表を作成するDownload2241: TeamPage 6.2.31 リリースノートDownload2004: 機材レンタル管理プラグインDocDailyReports2: 必要なプラグインのインストール
参照している (1)
DocJp1801: セクション テーブル ウィジェット 2.0
Article: Download1682 (permalink)
Categories: :DocJp:プラグイン
Date: 2016/06/08; 14時47分23秒 JST

Author Name: TeamPage サポート
Author ID: jpbo