SMART datagrid v.1 > Examples

Back  Forward

Row Grouping  Example  準備中...

行のグルーピングはリレーショナルデータべスのGroup Byと似たように、 指定されたフィールぢ達の値たちが同一な行達を束ねてその合計などを表示する方法である。 SMART datagrid GridViewでは束ねられた行達を隣のグリッド行達で表示する。 また、グループヘッダーやフッターを束ねる前か後に表示することができる。 

ユーザーはグルーピングしようとしているフィールドに繋がったカラムのヘッダーをグルーピングパンネルの領域にドラッグして行のグルーピングを設定することができる。 グルーピングパンネルには現在グルーピングが設定されたグループフィールドたちの目録が表示され、 フィールドビューの右閉じるボタンをクリックしてグルーピングから外すことができる。 

また、行グルーピングはカラムではなくDataFieldを基準として実行されるが、 グルーピングパンネルにはフィールドに繋がったカラムのヘッダーを表示する。 

Grid - 1
rows

スクリプトではgroupByをコールして行のグルーピングを設定する。 また、行のグルーピングの状態が変わればGridView.onGroupedイベントが発生する。 変更になる直前には onGroupingイベントが発生する。 

このイベント内で明示的にfalseをリターンすればグルーピングの変更が進まない。 

既存のグルーピングを解体する。 

"国家""輸出入" フィールドでグルーピングする。 

選択されたカラムを行のグルーピングから例外にする。 

Code -1
    // groupingが変更になったら発生する。
    grdMain.onGrouped = function () {
        console.log('Row grouping is changed.');
    });
    // group byを解体する。
    grdMain.clearGroupBy();
    // group by
    grdMain.groupBy(['country', 'flow']);

行グループごとに表示されるグループフッターに表示される値やスタイルは カラムのgroupFooterプロパティーで設定できる。 ソースを見る 

See Also
GridView.groupBy
GridView.clearGroupBy
GridColumn.groupFooter