kendo grid - 来自数据库

时间:2017-03-26 05:39:10

标签: asp.net-mvc kendo-grid

我有一个SQL表结果。

ProductNumber ProductNumberColorClass OrderNumber OrderNumberColorClass

我正在尝试使用Kendo来呈现此信息。基本上我需要输出

ProductNumber OrderNumber

数据值和Apply Css类(ProductNumberColorClass)

基本上这是一个包含大量列的报告。用户只能选择他想要查看的列。

我可以使用网站上的示例渲染网格。我无法申请。

我的应用程序是Asp.net mvc application

更新

我会尝试您的反馈意见。这是我的代码。基本上我想避免为每列编码,因为列表大约50。报告可以自定义,以便用户可以隐藏一些列。 。所以我用了一个循环。但是在这种情况下,clienttemplate不起作用。我不太确定,如果它也是代码问题。

如果你能找到我的代码中的错误,它也会帮助我了解这个问题。

同时我将手动键入列并添加属性为可见

@(Html.Kendo().Grid <DataTransferObjects.ViewModels.UserReportDataModel>()
    .Name("Grid")
    .HtmlAttributes(new { style = "height: 550px;" })
    .Pageable(pageable => pageable
        .Input(true)
        .Numeric(false)
     )
    .Sortable()
    .Scrollable(
        scr => scr.Height(430)
    )
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
         .Read(read => read.Action("GetReportData", "ShortTermPlanner").Data("AdditionnalParameters"))
        .PageSize(20)
        .ServerOperation(false)
     )
    .Columns(columns =>
    {
        var colIndex = 0;
        foreach (var col in Model.lstHeaderInformation)
        {
            if (col.SqlColumnName == "ProductNumber")
            {
                columns.Bound(col.SqlColumnName)
                        .Title(col.ColumnHeader)
                        .Filterable(false)
                        .Visible(col.IsVisible)
                        .Width(1190)
                        .ClientTemplate("<div style='background-color:red; text-align:center;width:70px'> #= ProductNumber # </div>");                                                                   

            }
            else
            {

                columns.Bound(col.SqlColumnName)
                            .Title(col.ColumnHeader)
                            .Filterable(true)
                            .Visible(true)
                            .Width(300)
                            .Locked(true)
                            .HtmlAttributes(new { @class = "selectedRow" });
            }
        }
    })
       .Resizable(resize => resize.Columns(true))
       .Reorderable(reorder => reorder.Columns(true))


)

更新2 添加clienttemplate并指定列信息有效。感谢

但是我很好奇,有没有更好的方法可以循环显示一个3表,该表定义了需要显示并应用于我的报告的列名,标题和类。

我正在寻找的是

我的报告 - 从报告中选择* 我的标题表从reportcoldefinication

中选择colname,title,class

现在对于来自reportcoldefinication的每个匹配的colname  和报告。在应用类的情况下向网格添加col。

1 个答案:

答案 0 :(得分:3)

您可以将模板功能用于Kendo网格中的列 columns.Template(@<div class= '#=ProductNumberColorClass #'> #= ProductNumber#<div/>)

在以下链接的示例中实现了一个。它使用JQuery实现,但您可以使用剃刀语法来实现相同的功能。 http://dojo.telerik.com/ukIma/3