用於選擇的 KendoUI Grid Ajax 綁定參數

我的 ASP.NET MVC 應用程序有一個基本網KendoUI格，它使用 ajax 綁定進行讀取。我想增強這一點，以便使用網格上方的表單來幫助選擇應在網格中顯示的數據。這是一個標準的搜尋表單，包含基本欄位，如名字、姓氏、出生日期、客戶來源等，並帶有搜尋按鈕。當按下搜尋按鈕時，我想強製網格通過傳入帶有我上面引用的欄位的搜尋模型來從控制器獲取符合條件的數據。

搜尋表單包含在 _CustomerSearch 部分視圖中。

我之前使用 Telerik MVC 擴展實現了這種事情，方法是利用 OnDataBinding 客戶端事件並在那裡更新參數值，然後手動進行 Ajax 呼叫以獲取數據。KendoUI 似乎不會以同樣的方式執行。

看法

@Html.Partial("_CustomerSearch", Model)
<hr>
@(Html.Kendo().Grid<ViewModels.CustomerModel>()    
   .Name("Grid")
   .Columns(columns =>
   {
       columns.Bound(p => p.Id).Hidden(true);
       columns.Bound(p => p.FirstName);
       columns.Bound(p => p.LastName);
       columns.Bound(p => p.DateOfBirth).Format("{0:MM/dd/yyyy}");
       columns.Bound(p => p.IsActive);
   })
   .Scrollable()
   .Filterable()
   .Sortable()
   .DataSource(dataSource => dataSource
       .Ajax()
       .Read(read => read.Action("_Search", "Customer"))
   )
)

控制器

public ActionResult _Search([DataSourceRequest]DataSourceRequest request)
{
   return Json(DataService.GetCustomers2().ToDataSourceResult(request));
}

我設想控制器看起來像這樣，但找不到任何以這種方式實現的範例，這就是我需要幫助的地方。

public ActionResult _Search([DataSourceRequest]DataSourceRequest request, CustomerSearchModel customerSearchModel)
{
   return Json(DataService.GetCustomers2(customerSearchModel)
              .ToDataSourceResult(request));
}

如果您的要求可以通過內置過濾來解決，那麼 Nicholas 的回答可能會起作用。但是，如果您的需求可以通過內置過濾來解決，您為什麼要創建自定義搜尋表單？

所以我想你有理由手動進行搜尋，所以這就是我們在項目中完成它的方式（所以也許有更簡單的方法，但這仍然對我們有用）：

控制器動作很好：

public ActionResult _Search([DataSourceRequest]DataSourceRequest request, 
                           CustomerSearchModel customerSearchModel)
{
   return Json(DataService.GetCustomers2(customerSearchModel)
              .ToDataSourceResult(request));
}

下一步：您需要一個 JavaScript 函式，該函式從搜尋表單中收集數據（JS 對象的屬性名稱應與您的屬性名稱匹配CustomerSearchModel）：

function getAdditionalData() {
   // Reserved property names
   // used by DataSourceRequest: sort, page, pageSize, group, filter
   return {
       FirstName: $("#FirstName").val(),
       LastName: $("#LastName").val(),
       //...
   };
}

然後你可以配置這個函式在每次讀取時呼叫：

.DataSource(dataSource => dataSource
       .Ajax()
       .Read(read => read.Action("_Search", "Customer")
                         .Data("getAdditionalData"))
   )

最後在你的按鈕點擊你只需要刷新網格：

$('#Grid').data('kendoGrid').dataSource.fetch();

引用自：https://stackoverflow.com/questions/15667418