1

私は Kendo UI Grid を持っていて、マウス イベントを jQuery でグリッドに追加しました (例: クリック)。これは問題なく動作しています。ただし、グリッドの行を削除すると、グリッドのすべてのイベントも削除されます。私は何を間違っていますか？

これは行を削除する私のコードです:

var rowToDelete = $(this).closest("tr");
var grid = $("#gridId").data("kendoGrid");
grid.removeRow(rowToDelete);

グリッドの各行にボタンを追加し、対応する行を削除するこれらのボタンにクリック イベントを追加しました。行が削除されると、他のすべてのボタンのクリック イベントが削除されます。グリッド列のマウスオーバー イベントと同じです。

ご協力いただきありがとうございます！

4

2 に答える 2

2

すべてのコードを投稿しているわけではないので、推測する必要があります...

初期化の直後に要素に関連付けられたイベント ハンドラーを設定すると、特定の HTML 要素が発生しますが、Kendo UI グリッドが再生成される状況があります (基本的に、システムはテーブルを削除して新しいテーブルを生成します)。

現在のテーブル コンテンツではなく、将来のテーブル コンテンツに対してイベント ハンドラーを設定する場合は、jQueryonイベントを使用できますが、2 番目がセレクターである 3 つの引数を使用します (以前のバージョンの jQuery では、これはlive関数で実現されていましたが、現在は非推奨です) 。であるため、jQuery のバージョンがサポートしている場合は、より適切に使用してくださいon)。

あなたがしなければならないことは次のとおりです。

$("#grid").on("click", ".my-selector", function(e) {
    var rowToDelete = $(this).closest("tr");
    var grid = $("#gridId").data("kendoGrid");
    grid.removeRow(rowToDelete);
});

ボタンを識別するためにおそらくすでに設定されてmy-selectorいる CSS属性はどこにありますか。classremove

于 2013-08-13T13:31:39.580 に答える
2

以下のコード スニペットを試してみてください。

見る

<script>
function gridDataBound(e) {
    var grid = $("#Grid").data("kendoGrid");
    grid.tbody.find(">tr").click(function () {
        $("#divTest").html('Row Index Clicked :' + $(this).index());
    });
}

function DeleteRow(obj) {
    var rowToDelete = $(obj).parent().parent()
    var grid = $("#Grid").data("kendoGrid");
    grid.removeRow(rowToDelete);
}
</script>
@(Html.Kendo().Grid<MvcApplication1.Models.TestModels>()
.Name("Grid")
.Columns(columns =>
{
    columns.Bound(p => p.ID);
    columns.Bound(p => p.Name);
    columns.Template(@<text></text>).ClientTemplate("<input type='button' class='k-button' value='Delete' onclick='DeleteRow(this);' />");

})
.Pageable()
.Sortable()
.Filterable()
.DataSource(dataSource => dataSource
    .Ajax()
        .Read(read => read.Action("Grid_Read", "Home"))
)
.Events(e => e.DataBound("gridDataBound"))
)
<div id="divTest"></div>

コントローラ

public ActionResult Grid_Read([DataSourceRequest] DataSourceRequest request)
    {
        List<TestModels> models = new List<TestModels>();

        for (int i = 0; i < 5; i++)
        {
            TestModels t1 = new TestModels();
            t1.ID = i;
            t1.Name = "Name" + i;
            models.Add(t1);
        }

        return Json(models.ToDataSourceResult(request));
}

モデル

public class TestModels
{
    [Display(Name = "ID")]
    public int ID { get; set; }

    [Display(Name = "Name")]
    public string Name { get; set; }

}

気になることがあれば教えてください。

于 2013-08-13T13:03:15.687 に答える