如何在頁面加載時單擊劍道網格第一行

Question

我有劍道網格id = AddressID 。 頁面加載時如何自動單擊第一行？

我嘗試了下面的代碼，但沒有運氣

var grid = $("#AddressGrid").data("kendoGrid");
    grid.select("tr:eq(1)");

我試過這個它選擇了行，但我想觸發點擊

$(document).ready(function () {
    var grid = $("#AddressGrid").data("kendoGrid");
    grid.select(grid.tbody.find("tr:eq(1)").click());
});

Answer 1

如果您的數據尚未加載，則無需select任何內容。 您必須指定dataBound事件並添加您自己的處理程序。

更新：每當以編程方式或用戶鼠標選擇一行時，就會觸發change事件。

 $("#grid").kendoGrid({ dataSource: { type: "odata", transport: { read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers" }, pageSize: 20 }, height: 550, sortable: true, selectable: "row", pageable: { refresh: true, pageSizes: true, buttonCount: 5 }, columns: [ { field: "ContactName", title: "Contact Name" }, { field: "ContactTitle", title: "Contact Title" }, { field: "CompanyName", title: "Company Name" }, { field: "Country" } ], change: onChange, dataBound: onDataBind // Callback handler }); function onDataBind(e) { this.select("tr:eq(0)"); // this === $("#grid").data("kendoGrid") } function onChange(arg) { const selected = [...this.select()].pop(); // multi-select is off const record = this.dataItem(selected); console.log(record.ContactName); }

 .as-console-wrapper { max-height: 4em !important; } .as-console .as-console-row .as-console-row-code, .as-console-row-code, .as-console-row:after { font-size: smaller; } .k-grid { font-size: 0.667rem; } .k-grid td { line-height: 1.667rem; }

 <link href="https://kendo.cdn.telerik.com/2020.3.915/styles/kendo.common-material.min.css" rel="stylesheet"> <link href="https://kendo.cdn.telerik.com/2020.3.915/styles/kendo.materialblack.min.css" rel="stylesheet"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://kendo.cdn.telerik.com/2020.3.915/js/kendo.all.min.js"></script> <div id="grid"></div>