Kendo Ui網格在搜索按鈕點擊後沒有重新綁定

Question

我在Kendo Ui網格在搜索按鈕點擊後不會重新綁定新結果的情況下遇到了困難。請讓我知道我該如何實現這一點。謝謝

目前，GetList將正確返回數據，但KendoUi網格不會與新結果重新綁定。

.cshtml

<div id="search"> 

     <div> 
      <div class="searchOption"> 
       @Html.LabelFor(model => model.HRN) 
       @Html.EditorFor(model => model.HRN) 
      </div> 

     </div> 

     <div> 

      <div class="smallBox"> 
       <input type="button" id="btnSearch" style="height:32px; font-size:14px; background-color:#3399FF" class="k-button" title="Search" value="Search" /> 

      </div> 

     </div> 
     <div> 
      <div class="searchOption"> 
       @Html.LabelFor(model => model.FamilyName) 
       @Html.EditorFor(model => model.FamilyName) 
      </div> 

     </div> 

     <div> 
      <div class="searchOption"> 
       @Html.LabelFor(model => model.GivenName) 
       @Html.EditorFor(model => model.GivenName) 

      </div> 

     </div> 
     <div> 
      <div class="searchOption"> 
       @Html.LabelFor(model => model.Priority) 
       @Html.EditorFor(model => model.Priority) 
      </div> 

     </div> 

</div> 

@(Html.Kendo().Grid<PWeb_App.ViewModels.ResultModel>() 

     .Name("Result") 
     .HtmlAttributes(new { @Style = "align:center; font-size:10px; width:985px" }) 
     .Events(ev => ev.Change("onChange")) 
     .Columns(columns => 
     { 
      columns.Bound(p => p.GivenName).Width(90); 
      columns.Bound(p => p.FamilyName).Width(90); 
      columns.Bound(p => p.Community).Width(130); 

     }) 
     .ToolBar(toolbar => toolbar.Save()) 
     .Editable(editable => editable.Mode(GridEditMode.InCell)) 
     .Sortable() 

     .Pageable(paging => paging 
      .Input(false) 
      .Numeric(true) 

      .PreviousNext(true) 
      .PageSizes(new int[] { 5, 10, 25, 50 }) 
      .Refresh(false) 

     ) 

     .Selectable() 
     .Scrollable() 
     .ColumnMenu(c => c.Columns(false)) 
     .DataSource(dataSource => dataSource 

      .Ajax()//bind with Ajax instead server bind 
      .PageSize(10) 
      .ServerOperation(true) 
       .Model(model => 
       { 
        model.Id(p => p.Pid); 
        model.Field(p => p.FamilyName).Editable(false); 
        model.Field(p => p.GivenName).Editable(false); 



       }) 


         .Read(read => read.Action("GetData", "Details").Type(HttpVerbs.Get)) 
         .Update("Edit", "Details") 

      ) 

    ) 


<script type="text/javascript"> 
$(document).ready(function() { 

$('#btnConsumerSearch').click(function (e){ 

      var community = $("#Community").val(); 
      var familyName = $("#FamilyName").val(); 
      var givenName = $("#GivenName").val(); 


       $.ajax({ 
       type: 'POST', 
       complete: function(e) { 
         $("#Result").data("kendoGrid").dataSource.read(); 
       }, 

       url: "@(Url.Content("~/Details/GetData/"))", 
       data: { 

         "Community":community, 
         "FamilyName":familyName, 
         "GivenName":givenName 


       }, 

       success: function() { 
        $("#btnSearch").removeAttr('disabled'); 

       } 

       }); 
       $("#btnSearch").attr('disabled','disabled'); 


     }); 

}); 
</script> 

控制器：

//下面的代碼將返回數據如預期，不過劍道網格不與下面的代碼的結果刷新新的結果：

public ActionResult GetData([DataSourceRequest] DataSourceRequest request, SearchCriteria model) 
     { 
      DataTable result = GetList(model); 
      Response.Cache.SetCacheability(HttpCacheability.NoCache); 
      return Json(result.ToDataSourceResult(request), JsonRequestBehavior.AllowGet); 
     } 


     /// <summary> 
     /// Get all available List from Client table and return using datatable 
     /// </summary> 
     /// <returns></returns> 
     private DataTable GetList(SearchCriteria model, string ReferralListID) 
     { 
      using (PEntities context = new PEntities()) 
      { 


       string ConnectionString = (context.Connection as EntityConnection).StoreConnection.ConnectionString; 
       SqlConnectionStringBuilder builder = new SqlConnectionStringBuilder(ConnectionString); 
       builder.ConnectTimeout = 2500; 
       using (SqlConnection con = new SqlConnection(builder.ConnectionString)) 
       { 
        using (SqlDataAdapter adapter = new SqlDataAdapter()) 
        { 
         using (SqlCommand cmd = new SqlCommand("spListResults", con)) 
         { 

          cmd.CommandType = CommandType.StoredProcedure; 

          cmd.Parameters.Add("paramCommunity", SqlDbType.VarChar, 100).Value = !String.IsNullOrEmpty(model.Community) ? (object)model.Community : DBNull.Value; 
          cmd.Parameters.Add("paramGivenName", SqlDbType.VarChar, 100).Value = !String.IsNullOrEmpty(model.GivenName) ? (object)model.GivenName : DBNull.Value; 
          cmd.Parameters.Add("paramFamilyName", SqlDbType.VarChar, 100).Value = !String.IsNullOrEmpty(model.FamilyName) ? (object)model.FamilyName : DBNull.Value; 
          cmd.Parameters.Add("paramPriority", SqlDbType.VarChar, 10).Value = !String.IsNullOrEmpty(model.Priority) ? (object)model.Priority : DBNull.Value; 

          adapter.SelectCommand = cmd; 
          cmd.CommandTimeout = 0; 
          DataTable dt = new DataTable(); 
          adapter.Fill(dt); 
          return dt; 
         } 
        } 
       } 




      } 

     } 

Answer 1

像這樣嘗試，

在您的鑑於這樣的

.Read(read => read.Action("GetData", "Details").Data("GetData")) 

您按鈕的讀法應該是Submit型

<input type="Submit" id="btnSearch" style="height:32px; font-size:14px; background-color:#3399FF" class="k-button" title="Search" value="Search" /> 

腳本

function GetData() { 
    return { 
HRN: $('#HRN').val(), 
FamilyName: $('#FamilyName').val(), 
GivenName: $('#GivenName').val(), 
Priority: $('#Priority').val() 

    }; 
} 



$(document).ready(function() { 
    $("#btnSearch").click(function (e) { 
      $("#Result").data("kendoGrid").dataSource.read(); 
      $("#Result").data("kendoGrid").refresh(); 
      e.preventDefault(); 
     }); 
}); 

控制器

public ActionResult GetData([DataSourceRequest] DataSourceRequest request, string HRN, string FamilyName, string GivenName, string Priority) 
     { 
      DataTable result = GetList(HRN,FamilyName,GivenName,Priority); 
      Response.Cache.SetCacheability(HttpCacheability.NoCache); 
      return Json(result.ToDataSourceResult(request), JsonRequestBehavior.AllowGet); 
     }