在MVC 3中，如何在部分視圖中更新kendo網格，然後在另一個局部視圖中選擇一行Kendo Grid？

Question

我有3個部分視圖的視圖。第一個局部視圖有一個Kendo網格，當您在網格中選擇一行時，它將填充並顯示具有另一個劍道網格的第二個局部視圖。它還會填充並顯示另一個網格的第三個局部視圖。

如果我選擇在第二劍道格行，我希望它把數據插入到了第三個網格使用該數據庫表，我想它刷新3格用新的數據。

我也有一個自定義按鈕（退休），在每一行還需要通過消除退役的項目更新同一電網第3格。

任何人都可以幫我設置它嗎？我應該使用3個部分視圖嗎？

Answer 1

我猜你正在使用的局部視圖加載每個網格，它的數據，將工作，但你必須當以填充第三格在第二柵極選擇行刷新整個頁面。

然而，Kendo Grid到遠程數據源可以很好地工作，您可以忽略將數據加載到部分視圖中的網格中，並使用一些jQuery來請求第三個網格更新change事件。

我發現快了很多，以通過Ajax填充數據網格，然後在頁面加載的時候 - 但我有大量的數據！

我定義爲一個人搜索該更新一次搜索文本框改變

網時間網格更新： -

$("#PersonSearch").kendoGrid({ 
     columns: [ 
        { title: "Organisation", field: "cn", encoded: true }, 
        { title: "First name", field: "fn", encoded: true }, 
        { title: "Last name", field: "ln", encoded: true }, 
        { title: "Type", field: "pt", encoded: true }, 
        { title: "Date of birth", field: "db", encoded: true, format: "{0:dd/MM/yy}" }, 
        { title: "NHS number", field: "nn", encoded: true } 
     ], 
     //sortable: { mode: "multiple" }, 
     change: function() { 
      var selected = this.select() 
      data = this.dataSource.getByUid(selected.data("uid")); 
      if (data.url != "") { 
       .... do anything on a row being selected 
      } 
      else { 
       this.clearSelection(); 
      } 
     }, 
     filterable: false, 
     scrollable: { virtual: true }, 
     sortable: true, 
     selectable: true, 
     groupable: false, 
     height: 480, 
     dataSource: { 
      transport: { read: { url: "../Person/PeopleRead/", type: "POST" } }, 
      pageSize: 100, 
      serverPaging: true, 
      serverSorting: true, 
      sort: [ 
       { field: "cn", dir: "asc" }, 
       { field: "ln", dir: "asc" }, 
       { field: "fn", dir: "asc" }, 
      ], 
      serverFiltering: true, 
      serverGrouping: true, 
      serverAggregates: true, 
      type: "aspnetmvc-ajax", 
      filter: [], 
      schema: { 
       data: "Data", total: "Total", errors: "Errors", 
       model: { 
        id: "cID", 
        fields: { 
         db: { type: "date", defaultValue: null } 
        } 
       } 
      } 
     } 
    }); 

我觸發電網，以填補更多的數據時，搜索框被改變： -

$('#GenericSearchString').keyup(function() { 
    // get a reference to the grid widget 
    var grid = $("#PersonSearch").data("kendoGrid"); 

    // refreshes the grid 
    grid.refresh(); 
    grid.dataSource.transport.options.read.url = "../Person/PeopleRead/" + $(this).val(); 
    grid.dataSource.fetch(); 
}); 

論在Person控制器我有一個方法PeopleRead服務器側： -

[HttpPost] 
    public ActionResult PeopleRead(String id, [DataSourceRequest]DataSourceRequest request) 
    { 
     WebCacheController Cache = ViewBag.Cache; 
     if (id == null) id = ""; 
     string urlBase = Url.Content("~/"); 

     var PeopleList = from c in db.Connections 
         where c.Person.Firstname.Contains(id) || c.Person.LastName.Contains(id) 
         select new 
         { 
          oID = c.Organisation.OrganisationID, 
          connID = c.ConnectionID, 
          cn = c.Organisation.Name, 
          fn = c.Person.Firstname, 
          pt = 
           (
            c.Type == ModelEnums.ConnectionTypes.Customer ? "Customer" : 
            c.Type == ModelEnums.ConnectionTypes.Owner ? "Owner" : 
            c.Type == ModelEnums.ConnectionTypes.Service_User ? "Service user" : 
            c.Type == ModelEnums.ConnectionTypes.Worker ? "Worker" : 
            c.Type == ModelEnums.ConnectionTypes.Profile ? "Profile" : "Unknown" 
           ), 
          url = 
           (
            c.Type == ModelEnums.ConnectionTypes.Customer ? "" : 
            c.Type == ModelEnums.ConnectionTypes.Owner ? "" : 
            c.Type == ModelEnums.ConnectionTypes.Service_User ? urlBase + "ServiceUser/Details/" : 
            c.Type == ModelEnums.ConnectionTypes.Worker ? urlBase + "Worker/Details/" : 
            c.Type == ModelEnums.ConnectionTypes.Profile ? "" : "" 
           ), 
          ln = c.Person.LastName, 
          nn = c.Person.NHSNumber, 
          db = c.Person.DateOfBirth 
         }; 


     DataSourceResult result = PeopleList.ToDataSourceResult(request); 
     return Json(result); 
    } 

對不起的例子是有點題外話，但我雖然最好是有工作的代碼作爲例子。

在你的情況下，第二個網格的變化會改變grid3.dataSource.transport.options.read.url，然後做一個grid3.dataSource.fetch（）;

我必須包含參考kendo.mvc以及更多關於mvc項目以及鏈接到cshtml中的kendo.aspnetmvc.min.js。