更改Kendo UI网格中的列

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网格如下定义-在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

我在Visual Studio中没有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);
                      })