首页 > 解决方案 > MVC 剑道二头

问题描述

在 MVC Kendo 中,我可以有两个 thead 行吗?第一个将跨越第二行中的三个 td。以下是我要做什么的示例?该模型正在返回一个 theadViewModel 列表。使用模型数据看起来像这样?

               Name     
Columns1    Columns2    Columns3
ColumnsData ColumnsData ColumnsData

模型

public class theadViewModel
    {
        public string Name { get; set; }
        public int Id { get; set; }
        public List<DataViewModel> DataViewModel { get; set; }
    }

 public class DataViewModel
{
    public string Columns1 { get; set; }
    public string Columns2 { get; set; }
    public string Columns3 { get; set; }
}  

看法

 @(Html.Kendo().Grid(Model)
         .Name("Grid")

         .Columns(columns =>
          {
          columns.Bound(p => p.Name);
         })
         .Pageable()
         .Sortable()
         .Scrollable()
         .Filterable()
         .Groupable()
        )

标签: kendo-uikendo-gridkendo-asp.net-mvc

解决方案


Kendo Grid 允许多列标题。您可以在此处找到文档。

这是一个例子:

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.CustomerViewModel>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Group(group => group
            .Title("Contact Info")
            .Columns(info => { 
                info.Bound(x => x.ContactTitle).Width(200);
                info.Bound(x => x.ContactName).Width(200);
            })
        );
    })
    .ColumnMenu()
    .Resizable(resizable => resizable.Columns(true))
    .Reorderable(reorderable => reorderable.Columns(true))
    .HtmlAttributes(new { style = "height: 550px;" })
    .Scrollable()
    .Groupable()
    .Sortable()
    .Pageable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("MultiColumn_Customers_Read", "Grid"))
    )
)

推荐阅读