Question

我想在Destroy按钮上编写一个Jquery来将它们存储在一个数组中：

因为我使用Kendo Grid作为::

 @(Html.Kendo().Grid(Model)
                .Name("Passenger")
                        .TableHtmlAttributes(new { style = "height:20px; " })
                            //.TableHtmlAttributes(new { style:"height:30px;"})
                .Columns(columns =>
                {
                    columns.Bound(p => p.ID).Hidden(true).ClientTemplate("#=ID#" + "<input type='hidden' class='ID' value='#=ID#' />");
                    columns.Bound(p => p.PassengerName).Width(15).Title("Name").ClientTemplate("#=PassengerName#" + "<input type='hidden' class='PassengerName'' name='#=PassengerName#' value='#=PassengerName#' />");
                    columns.Command(command => { command.Edit().Text(" "); command.Destroy().Text(" "); }).Width(15);
                })

                .Editable(ed => ed.Mode(GridEditMode.PopUp).DisplayDeleteConfirmation(false).TemplateName("NewPerson").CreateAt(GridInsertRowPosition.Bottom))

                .Navigatable()
                .Sortable()
                .Scrollable(scr => scr.Height(200))
                .Scrollable()
                .DataSource(dataSource => dataSource
                .Ajax()
                .Batch(true)
                .ServerOperation(false)
                .Events(events => events.Error("error_handler"))
                .Model(model => model.Id(p => p.PassengerID))
                .Create("Passenger_Create", "Document")
                .Read("Passenger_Read", "Document")
                .Update("Passenger_Update", "Document")
                .Destroy("Passenger_Destroy", "Document")
                )
            )

我正在为Click事件编写Jquery代码::

var delPassenger = [];
        $("td > .k-grid-delete").click(function () {
            var del = $(this).closest("tr").find(".ID");
            delPassenger.push(del);
            //for (var i = 0; i < del.length; i++) {
            //    $(".MainForm").append("<input type='hidden' name='delPassenger[" + i + "]' class='delPassenger' value='" + del[i].value + "' />");
            //}
        })

但是这个Click事件不起作用。请帮帮我。

Answer 1

由于kendo网格动态生成表格。您需要使用.on()

进行事件委派

$(document.body).on('click','td > .k-grid-delete',function () {
            var del = $(this).closest("tr").find(".ID");
            delPassenger.push(del);
            .................... 
        })

document或document.body指的是最近的父元素。

Answer 2

使用.on()

由于元素是动态添加的，因此无法将事件直接绑定到它们。因此，您必须使用Event Delegation。

$(document).on('click','td > .k-grid-delete',function () {  ..code here.. });

语法

$( elements ).on( events, selector, data, handler );

Jquery Click事件不适用于Kendo Grid

2 个答案: