首頁猿問在 Kendo UI...

在 Kendo UI 中使用父網格的數據源設置子網格的數據源

JavaScript

達令說 2024-01-18 10:48:30

我有這個表格：@*Some form fields here that accept startDate and endDate*@<div> <button id="searchButton">Search</button></div><div class="col-md-12 row"> @(Html.Kendo() .Grid<ProjectName.DataModels.Models.Customer>() .Name("CustomerGrid") .Columns(columns => { columns.Bound(e => e.CustomerId); columns.Bound(e => e.SomeCustomerColumn); }) .ClientDetailTemplateId("OrderDetails") .AutoBind(false) // Don't load the data yet because I'll need to supply parameters for the fetch .DataSource(dataSource => dataSource .Ajax() .Events(events=>events.Change("loadChildGrid")) .PageSize(20) .Model(model => model.Id("CustomerId", typeof(string))) .Read(read => read.Action("GetCustomersAsync", "Customer").Data("passArguments")) ) ) <script id="OrderDetails" type="text/kendo-tmpl"> @(Html.Kendo() .Grid<ProjectName.DataModels.Models.Order>() .Name("OrderDetails_#=CustomerId#") .Columns(columns => { columns.Bound(o => o.ProductName); columns.Bound(o => o.SomeOrderColumn); }) .DataSource(dataSource => dataSource .Ajax() .PageSize(10) .Model(model=>model.Id("OrderId")) .ServerOperation(false) ) .AutoBind(false) .ToClientTemplate() ) </script></div>

查看完整描述

1 回答

慕勒3428872

TA貢獻1848條經驗獲得超6個贊

經過幾個小時的打擊和嘗試，我終于解決了。因此，我將其發布在這里，以節省其他人遇到類似問題的時間：

我DetailExpand向主網格添加了一個事件。并刪除了Change上的事件dataSource。

@(Html.Kendo()

.Grid<ProjectName.DataModels.Models.Customer>()

.Name("CustomerGrid")

.Columns(columns =>

{

columns.Bound(e => e.CustomerId);

columns.Bound(e => e.SomeCustomerColumn);

})

.ClientDetailTemplateId("OrderDetails")

.AutoBind(false) // Don't load the data yet because I'll need to supply parameters for the fetch

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Model(model => model.Id("CustomerId", typeof(string)))

.Read(read => read.Action("GetCustomersAsync", "Customer").Data("passArguments"))

)

.Events(events => events.DataBound("dataBound").DetailExpand("onExpand"))

)

onExpand現在，每次我們在父網格中展開一行時，都會調用所調用的回調函數。這是我現在設置子網格的dataSource.

// Passing e is also important here because if you don't, this callback gets called

// for every row in the main grid (even when you don't expand them!)

function onExpand(e) {

var customerId = e.sender.dataItem(e.masterRow).CustomerId;

var orders = e.sender.dataItem(e.masterRow).Orders;

//Initialize the child grid as well

var childGridName = "#" + "OrderDetails_" + customerId;

var childGrid = $(childGridName).data("kendoGrid");

if (childGrid !== undefined) {

childGrid.dataSource.data(orders);

}

function dataBound() {

this.expandRow(this.tbody.find("tr.k-master-row").first());

}

我曾經e.sender.dataItem(e.masterRow).PROPERTYNAME從主行訪問我需要的屬性。

現在這工作完美無缺！

反對回復 2024-01-18

1 回答
0 關注
138 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

在 Kendo UI 中使用父網格的數據源設置子網格的數據源

在 Kendo UI 中使用父網格的數據源設置子網格的數據源

1 回答

添加回答