C# 刷新后剑道网格数据未正确绑定

当我加载页面时，它是一个部分页面，网格中填充了数据

但是一旦我像这样调用刷新方法

<button onclick="doRefresh">refresh</button>
<script type="text/javascript">
    var doRefresh = function () {
            var kendogrid = $("#this_Id").data("kendoGrid");                 
            kendogrid.refresh();
    }
</script>

@(Html.Kendo().PanelBar()
      .Name("panel-bar")
      .ExpandMode(PanelBarExpandMode.Multiple)
      .ExpandAll(true)
      .Items(panel =>
      {       
          panel.Add()
              .Text("<span id='batch-update-panel-bar-job'>JOB-TASK</span>")
              .Encoded(false)
              .Content("<div id='update-model'>" + Html.Action("BatchUpdateJob", "BatchUpdate", new { projectId = Model.Id}).ToHtmlString() + "</div>");      
      })
)

public ActionResult BatchUpdateJob(int projectId)
{
    mymodel = something;
    return PartialView("_MymodelPageJob", mymodel);
}

public ActionResult GetJobForBulkUpdate(int projectId, [DataSourceRequest] DataSourceRequest request)
    {            
           List<OfData> jobData = getData();
        return Json(jobData.ToDataSourceResult(request));
    }

刷新
var doRefresh=函数（）{
var kendogrid=$（“#此Id”）。数据（“kendogrid”）；
kendogrid.refresh（）；
}

它应该刷新网格，并使用当前绑定到网格的数据源重建网格。但是网格变空了

我认为我绑定的模型是错误的，因为一旦我刷新了网格，我就会丢失所有的数据。我已经尝试过绑定模型并使用bindto方法

以下是我的看法：

 @model List<bModel>

 @(Html.Kendo().Grid(Model)
        .Name("this_Id") // template expression, to be evaluated in the master context
    .Columns(columns =>
    {
        columns.Bound(m => m.Sequence).Title("Seq.");
        columns.Bound(m => m.JobType).Title("Job Type");
        columns.Bound(m => m.Service).Title("Service");
        columns.Bound(m => m.Status).Title("Status");
        columns.Bound(m => m.PropertyType).Title("Property Type");
        columns.Bound(m => m.PropertySubType).Title("Property SubType");
        columns.Bound(m => m.Address).Title("Address");
    })
    .Sortable()
    .Selectable(s => s.Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Row))
    .ClientDetailTemplateId("taskTemplate")
    .DetailTemplate(
               .......
        )
    .DataSource(dataSource => dataSource
        .Server()
        .Model(model => model.Id(jobItem => jobItem.Id))
    )
    .Read(read => read.Action("GetJobForBulkUpdate", "Project", new { jobId = "#=Id#" }))
    .Events(events => events.DetailExpand("detailExpand"))
)

@型号列表
@（Html.Kendo（）.Grid（模型）
.Name（“this_Id”）//要在主上下文中计算的模板表达式
.列（列=>
{
columns.Bound（m=>m.Sequence）.Title（“Seq.”）；
columns.Bound（m=>m.JobType）.Title（“作业类型”）；
columns.Bound（m=>m.Service）.Title（“Service”）；
columns.Bound（m=>m.Status）.Title（“Status”）；
columns.Bound（m=>m.PropertyType）.Title（“属性类型”）；
columns.Bound（m=>m.PropertySubType）.Title（“属性子类型”）；
columns.Bound（m=>m.Address）.Title（“地址”）；
})
.Sortable（）
.Selectable（s=>s.Mode（GridSelectionMode.Multiple）.Type（GridSelectionType.Row））
.ClientDetailTemplateId（“任务模板”）
.DetailTemplate(
.......
)
.DataSource（DataSource=>DataSource
.Server（）
.Model（Model=>Model.Id（jobItem=>jobItem.Id））
)
.Read（Read=>Read.Action（“GetJobForBulkUpdate”，“Project”，new{jobId=“#=Id#”}））
.Events（Events=>Events.DetailExpand（“DetailExpand”））
)

我这样调用面板栏中的视图

<button onclick="doRefresh">refresh</button>
<script type="text/javascript">
    var doRefresh = function () {
            var kendogrid = $("#this_Id").data("kendoGrid");                 
            kendogrid.refresh();
    }
</script>

@(Html.Kendo().PanelBar()
      .Name("panel-bar")
      .ExpandMode(PanelBarExpandMode.Multiple)
      .ExpandAll(true)
      .Items(panel =>
      {       
          panel.Add()
              .Text("<span id='batch-update-panel-bar-job'>JOB-TASK</span>")
              .Encoded(false)
              .Content("<div id='update-model'>" + Html.Action("BatchUpdateJob", "BatchUpdate", new { projectId = Model.Id}).ToHtmlString() + "</div>");      
      })
)

public ActionResult BatchUpdateJob(int projectId)
{
    mymodel = something;
    return PartialView("_MymodelPageJob", mymodel);
}

public ActionResult GetJobForBulkUpdate(int projectId, [DataSourceRequest] DataSourceRequest request)
    {            
           List<OfData> jobData = getData();
        return Json(jobData.ToDataSourceResult(request));
    }

@（Html.Kendo（）.PanelBar（）
.名称（“面板条”）
.ExpandMode（PanelBarExpandMode.Multiple）
.ExpandAll（正确）
.项目（面板=>
{       
panel.Add（）
.Text（“工作任务”）
.编码（假）
.Content（“+Html.Action”（“BatchUpdateJob”，“BatchUpdate”，new{projectd=Model.Id}）.ToHtmlString（）+”）；
})
)

控制器的方法是这样的

<button onclick="doRefresh">refresh</button>
<script type="text/javascript">
    var doRefresh = function () {
            var kendogrid = $("#this_Id").data("kendoGrid");                 
            kendogrid.refresh();
    }
</script>

@(Html.Kendo().PanelBar()
      .Name("panel-bar")
      .ExpandMode(PanelBarExpandMode.Multiple)
      .ExpandAll(true)
      .Items(panel =>
      {       
          panel.Add()
              .Text("<span id='batch-update-panel-bar-job'>JOB-TASK</span>")
              .Encoded(false)
              .Content("<div id='update-model'>" + Html.Action("BatchUpdateJob", "BatchUpdate", new { projectId = Model.Id}).ToHtmlString() + "</div>");      
      })
)

public ActionResult BatchUpdateJob(int projectId)
{
    mymodel = something;
    return PartialView("_MymodelPageJob", mymodel);
}

public ActionResult GetJobForBulkUpdate(int projectId, [DataSourceRequest] DataSourceRequest request)
    {            
           List<OfData> jobData = getData();
        return Json(jobData.ToDataSourceResult(request));
    }

公共操作结果BatchUpdateJob（int projectId） { 我的模型=某物； 返回PartialView（“MymodelPageJob”，mymodel）； } 公共操作结果GetJobForBulkUpdate（int projectId，[DataSourceRequest]DataSourceRequest请求） { List jobData=getData（）； 返回Json（jobData.ToDataSourceResult（request））； }

---

更新：用户更改了与Ajax的绑定，问题是返回的数据格式不正确。按照下面的Ajax格式示例修复传入数据格式有助于解决此问题

一旦我调用像这样的刷新方法，网格就会变为空kendogrid.refresh（）

使用正确的Html。操作不确定您的控制器是否被击中

@Html.Action("BatchUpdateJob", "ControllerName", new { projectId = Model.Id });

您只是在没有数据的网格上调用refresh，当然它会显示为空。因此，您希望基于某些设置超时自动刷新网格，因为目标数据在特定间隔后可能会不同

不要使用此选项您以错误的方式执行此操作。请参阅文档并清除您的基础知识

    var kendogrid = $("#this_Id").data("kendoGrid");
    console.log(kendogrid.dataItem());
    kendogrid.refresh();

改用这个-

 //read will request the server and reload only reload datasource
    $('#this_Id').data('kendoGrid').dataSource.read();

    //refresh will re-render items in grid from the current datasource
    $('#this_Id').data('kendoGrid').refresh(); 

现在 ----根据用户的要求，我正在为AJAX和服务器端绑定添加一个示例演示

AJAX绑定：如telerik文档中所述

视图模型

 public class ProductViewModel
    {
        public int ProductID { get; set; }
        public string ProductName { get; set; }
        public short? UnitsInStock { get; set; }
    }

Razor语法中的网格

  @(Html.Kendo().Grid<KendoGridAjaxBinding.Models.ProductViewModel>()
      .Name("grid")
      .DataSource(dataSource => dataSource
          .Ajax() 
      //Set the action method which will return the data in JSON format.    
          .Read(read => read.Action("Products_Read", "Home")) 

       )
       )
      .Columns(columns =>
      {
          columns.Bound(product => product.ProductID);
          columns.Bound(product => product.ProductName);
          columns.Bound(product => product.UnitsInStock);
      })
      .Pageable()
      .Sortable()
)

@（Html.Kendo（）.Grid（））
.名称（“网格”）
.DataSource（DataSource=>DataSource
.Ajax（）
//设置将以JSON格式返回数据的操作方法。
.Read（Read=>Read.Action（“Products\u Read”，“Home”））
)
)
.列（列=>
{
columns.Bound（product=>product.ProductID）；
columns.Bound（product=>product.ProductName）；
columns.Bound（product=>product.UnitsInStock）；
})
.Pageable（）
.Sortable（）
)

控制器

 public ActionResult Products_Read([DataSourceRequest]DataSourceRequest request)
        {
            using (var northwind = new NorthwindEntities())
            {
                IQueryable<Product> products = northwind.Products;
                //Convert the Product entities to ProductViewModel instances.
                DataSourceResult result = products.ToDataSourceResult(request, product => new ProductViewModel
                        {
                        ProductID = product.ProductID,
                        ProductName = product.ProductName,
                        UnitsInStock = product.UnitsInStock
                        });
                return Json(result);
            }
        }

public ActionResult产品\u读取（[DataSourceRequest]DataSourceRequest请求）
{
使用（var northwind=new NorthwindEntities（））
{
IQueryable产品=northwind.products；
//将产品实体转换为ProductViewModel实例。
DataSourceResult结果=products.ToDataSourceResult（请求，产品=>new ProductViewModel
{
ProductID=product.ProductID，
ProductName=product.ProductName，
UnitsInStock=product.UnitsInStock
});
返回Json（结果）；
}
}

服务器端绑定：如telerik文档中所述

有几种方法可以做到这一点：

• 绑定到视图模型
• 使用
• BindTo方法将附加数据传递给action方法

下面是讨论服务器端绑定下载的github解决方案

---

查看您缺少的内容-

@SeanCh Sorry周末很忙。在数据源上调用read会导致页面重新加载。我认为这是意料之中的，因为我的网格使用服务器数据绑定。但这不是我想要的，因为看起来我没有正确绑定模型，这就是为什么网格没有任何东西作为它的数据源对象。我将其更改为AJAX，但在检查数据源时确实看到了数据，但调用dataitem方法会返回null。进一步调查。感谢您的回复。我已经