jquery - 剣道グリッド行削除確認

Question

こんにちは、各行に削除ボタンがある剣道グリッドがあります。削除ボタンをクリックすると、「削除しますか？」のような確認を求められます。ここまでは大丈夫です。ここで、[はい] または [今すぐ] をクリックしたときにイベントをキャッチしたいと考えています。

はいをクリックすると、メッセージが表示されます。いいえをクリックすると、別のメッセージが表示されます。

剣道でこれらのイベントをキャッチするにはどうすればよいですか?

Answer 1

UweB は正しいです。destroy イベントにフックすることはできません。Kendo UI Code Library には、独自の削除確認をロールするための例があります。

http://www.kendoui.c​​om/code-library/web/grid/customize-the-delete-confirmation-dialog.aspx

リンクされたコード例では、剣道ウィンドウを使用し、はいといいえの両方のクリック イベントを処理する方法を提供します。カスタムの削除メッセージだけが必要な場合は、次のコード スニペットを使用します。

$("#grid").kendoGrid({
    columns: [
        {
            command: [{ name: "edit" }, {
                name: "Delete", imageClass: "k-icon k-i-close", click: function (e) {
                    e.preventDefault();
                    var dataItem = this.dataItem($(e.target).closest("tr"));
                    if (confirm('Do you really want to delete my favorite record?')) {
                        var dataSource = $("#grid").data("kendoGrid").dataSource;
                        dataSource.remove(dataItem);
                        dataSource.sync();
                    }
                }
            }], title: " ", width: "200px"
        }
    ]
});

Answer 2

これらをキャッチできるとは思えません。destroy イベントは組み込まれており、「そのまま」動作します。

ただし、作成する必要がある確認ダイアログを表示するカスタム コマンドを作成できるクリック イベント ( http://docs.kendoui.c​​omconfirm() /api/web/grid#configuration-columns.command.click ) があります (たとえば、見栄えはよくありませんが、今のところ機能する組み込みの JavaScript を使用します)。この場合、ボタンとそれらが起動するイベントを完全に制御できます。

Answer 3

上記のすべての例を試しましたが、解決できませんでした。シンプル

//Add this line of code to the grid
   columns.Command(command => command.Custom("Remove").Click("removeItem"));
   //Java script function to remove
       function removeItem(e) {
        //Get the instance of the grid
        var grid = $("#grid").data("kendoGrid");
        //Get the selected grid
        var tr = $(e.target).closest("tr");
        //Get the item from the grid
        var data = this.dataItem(tr);
        //Remove the item from the datasource
        grid.dataSource.remove(data);
        //Sync it with the grid
        dataSource.sync();
   }

Answer 4

私はUweBに同意します。そのようなイベントをキャッチする方法はありません。理想的には、KendoWindow を使用して自分で削除ダイアログを行うと、ページ UI としての自由度と外観が向上します。

以下を試してください：http://jsfiddle.net/vojtiik/KZ6pj/8/

コマンドを追加:

 command: [{
            name: "delete",
            text: "delete",
            click: _handleDelete,
            imageClass: "ui-icon ui-icon-close"
        }],

選択した項目をキャプチャし、コントロールをウィンドウに渡します。

  function _handleDelete(event) {
        dataitem = grid.dataItem($(event.currentTarget).closest("tr"));
        kWindow.open();
    }; 

あなたのことをして削除してください：

   $('.yesbtn').click(function () {
        console.log('My message');
        grid.dataSource.remove(dataitem);  
        kWindow.close();
    });