Question

我有一个ASP.NET MVC 5应用程序。 Kendo UI网格调用Web API控制器来检索数据。我需要根据Fuel类型的汽车更改列的内容。所以在我的页面模型中，我为Fuel Type创建了一个字符串。在MVC控制器中，然后将其设置如下：

model.FuelType = "Diesel"; //just hardcoded for testing in reality will be dynamically set by User in a Previous screen - could be set to Petrol in which case I need to change column data

在局部视图中，我的Kendo UI Grid定义如下 - 在PartialView上我有一个html.hiddenfor来存储FuelType的值

  @(Html.Kendo().Grid<Car.Web.Models.CarViewModel>()
                          .Name("CarViewGrid")
                          .Columns(columns =>
                          {
                              columns.Bound(c => c.Make).Width(180);
                              columns.Bound(c => c.ModelNo).Width(280);
                              columns.Bound(c => c.EngineSize).Width(120);
                              columns.Bound(c => c.Colour).Width(65);
                              columns.Bound(c => c.MPG).Width(65);

                              columns.Bound(c => c.CarId)
                                  .Title("Include in Report")
                                  .ClientTemplate("<input type=\"checkbox\" name=\"selectedIds\" value=\"#=CarId#\" class=\"checkboxClass\" />")
                                      .Width(90)
                                      .Sortable(false); 
                          })
                          .Events(builder => builder.DataBound("gridDataBound"))
                          .HtmlAttributes(new { style = "height: 420px;" })
                          .Scrollable()
                          .Sortable(sortable => sortable
                              .AllowUnsort(true)
                              .SortMode(GridSortMode.MultipleColumn))
                          .Pageable(pageable => pageable
                              .PageSizes(true)
                              .ButtonCount(5))
                          .DataSource(dataSource => dataSource
                              .Ajax()
                             .Read(read => read.Url("api/Car/GetCarDetails").Type(HttpVerbs.Get).Data("GetCustId"))
                          )
                          )

我在我的专栏中留下了一行空白，这就是我需要包含不同列的地方 - 如果FuelTyle是Petrol我需要

columns.Bound(c => c.NumberSparkPlugs).Width(65);

但如果FuelType是Diesel，我需要

columns.Bound(c => c.Torque).Width(65);

这两个都是我的CarViewModel上的字符串属性。

有没有人使用Kendo UI Grid做过类似的事情，或者可以用最好的方法来实现这个目标？

Answer 1

我在VisualStudio中没有Kendo MVC项目来测试它，但是你不能只使用if语句：

                      .Columns(columns =>
                      {
                          columns.Bound(c => c.Make).Width(180);
                          columns.Bound(c => c.ModelNo).Width(280);
                          columns.Bound(c => c.EngineSize).Width(120);
                          columns.Bound(c => c.Colour).Width(65);
                          columns.Bound(c => c.MPG).Width(65);

                          columns.Bound(c => c.CarId)
                              .Title("Include in Report")
                              .ClientTemplate("<input type=\"checkbox\" name=\"selectedIds\" value=\"#=CarId#\" class=\"checkboxClass\" />")
                                  .Width(90)
                                  .Sortable(false); 

// added code here...
                          if(Model.FuelType == "Petrol")
                              columns.Bound(c => c.NumberSparkPlugs).Width(65);
                          else
                              columns.Bound(c => c.Torque).Width(65);
                      })

更改Kendo UI Grid中的列

1 个答案: