SMART datagrid v.1 > Examples

Back  Forward

Grid Context Menu  Example  準備中...

Browserのcontextmenu イベントを横取りしてグリッドの為のコンテキストメニューを表示しりことができる。 

まず、GridBase.setContextMenuの呼び出してグリッドコンテキストメニューを登録する。 メニュー構成についてはMenu概要を参考する。 また、GridBase.setDefaultContextMenuで登録したメニューを基本メニューで設定することができる。 基本メニューはsetContextMenuを呼び出す時にメニューを指定しなければ実行になるメニューである。 

Code -1
    var menu = grdMain.setContextMenu([{
        label: "Add Row",
        callback: function () {
            grdMain.insert();
        }
    },
        ...
    ]);
    grdMain.setDefaultContextMenu(menu);
Grid - 1
rows

マウスクリックになった位置によって違うメニューセットを表示するか、 メニューを表示しないようにする場合はonContextPopupイベントを利用する。 このイベントハンドラーで明示的にfalseをリターンすればメニューが表示されず、 ブラウザーコンテキストメニューが表示される。
 また、ハンドラーの内でGridBase.setContextMenuを呼び出して表示されるメニューを変更することもできる。 この時、GridBase.registerPopupMenuを通して登録になったメニューを指定することができる。 

Code -2
    grdMain.onContextMenuPopup = function (grid, x, y) {
        var index = grid.pointToIndex(x, y);

        if (index && index.column && index.column.name() == "LoanNumber") {
            // 臨時メニューを実行する。
            grid.setContextMenu(menu2);
        } else if (index && index.column && index.column.name() == "Country") {
            // falseをリターンすればグリッドメニューの代わりにブラウザーメニューが実行される。
            return false;
        } else if (index && index.column && index.column.name() == "Currency") {
            // registerPopupMenu()で登録されたメニューを実行させる。
            return grid.setContextMenu('menu1');
        } else {
            // default contextメニューが実行される。
            grid.setContextMenu(null);
        }
    };

メニュー項目がクリックになったら、メニュー項目にcallbackが設定された場合callbackが実行され、 そうでない場合GridBase.onContextMenuClickedイベントが発生する。 ソースを見る 

See Also
GridBase.setContextMenu
GridBase.setDefaultContextMenu
GridBase.onContextMenuPopup
GridBase.onContextMenuClicked
GridBase.registerPopupMenu
GridBase.unregisterPopupMenu
GridBase.getPopupMenu
GridBase.pointToIndex
Menu
exportToExcel