グリッドへのフッターセクションの追加
ウィジェットの ShowFooter プロパティを有効にするか、JSON コンフィギュレーションデータを使用して、グリッドにフッターセクションを追加できます。フッターを追加すると、特定の列の値の合計や平均などのサマリー情報を表示できます。フッターにヘッダー列名を表示するには、ShowHeaderRowInFooter プロパティを有効にします。
構築済みの関数
以下の構築済みの関数を使用して、グリッド上の各列のフッターデータを表示できます。
• {#stat_count} - 行数をカウントします。
• {#stat_max} - 列内の値のクライアント側の最大値を計算します。
• {#stat_min} - 列内の値のクライアント側の最小値を計算します。
• {#stat_average} - 列内の値のクライアント側の平均値を計算します。
• {#stat_total} - 列内の値のクライアント側の合計値を計算します。
• {#cspan} - 列を連結します。これにより、フッター内のセルをマージできます。セルをマージする場合、列の順序変更を無効にしてください。列の順序変更により、フッターの外観が影響を受ける場合があります。
 |
データサービス内でカスタム関数を定義して使用することもできます。
|
フッター内のデータを整列させるには、#cspan および text-align:left または text-align:right 整列オプションを使用します。テキストにコンマの HTML エスケープ文字を追加してから、デフォルトでは text-align:left に設定されている整列設定を追加します。
フッターのデータサービスの作成
フッターを設定するには、FooterData プロパティに使用するコンフィギュレーション規則を定義するインフォテーブルをバインドしなければなりません。グリッドフッターのデータを含むインフォテーブルを定義するサービスの例を次に示します。
インフォテーブル出力を保存する変数を定義します。
var result = createInfoTable();
function createInfoTable() {
var params = {
infoTableName: undefined /* STRING */
};
function createInfoTable() {
var params = {
infoTableName: undefined /* STRING */
};
インフォテーブルを定義した後、AddField メソッドを使用して、グリッドデータ内のフィールド名と一致する列を作成します。
var result = Resources["InfoTableFunctions"].CreateInfoTable(params);
//Add field to the InfoTable, ensure same field names in this footer data as are used in the actual table data:
result.AddField({name: "deviceName", baseType: "STRING"});
result.AddField({name: "motorTemp", baseType: "STRING"});
//Add field to the InfoTable, ensure same field names in this footer data as are used in the actual table data:
result.AddField({name: "deviceName", baseType: "STRING"});
result.AddField({name: "motorTemp", baseType: "STRING"});
フッターのコンテンツを定義するには、以前に作成したインフォテーブルの列にデータを追加します。
result.AddRow({
'deviceName': 'Count: {#stat_count}', // Calculate the number of rows under the column.
'motorTemp': 'Average: {#stat_average}', // Calculate the average of all the values under the column.
});
return result;
}
以下の図は、グリッドウィジェットにバインドされているときのサービスの出力を示しています。
