Question

是否可以在一个Kendo UI MVC组件中应用特定主题？我有一个网格，我想用不同的主题进行自定义。

类似于jQuery版本的东西

$("#chart").kendoChart({
    theme: "[theme]"
    ...
});

这就是我所拥有的：

@(Html.Kendo().Grid<xxxxx.Models.CountrySelectionModel>()
        .Name("countrySelectionGrid")            
        .Columns(columns =>
        {
            columns.Bound(c => c.DepartureCountry);
            columns.Bound(c => c.ArrivalCountry);
            columns.ForeignKey(c => c.TargetCountryId, (SelectList)ViewBag.ValidCountryDataSource)
                   .EditorTemplateName("CountrySelectionEditorTemplate")
                   .ClientTemplate("#: TargetCountry #");
            columns.Command(command => { command.Edit(); }).Width(180);
        })

        .ColumnMenu()
        .Editable(editable => editable.Mode(GridEditMode.InLine))
        .Pageable(pager => pager
            .PageSizes(true)                
        )

        .Navigatable()
        .Selectable(selectable =>
        {
            selectable.Mode(GridSelectionMode.Single);
            selectable.Type(GridSelectionType.Row);
        })
        .Sortable(sortable =>
        {
            sortable.SortMode(GridSortMode.SingleColumn);
        })
        .Filterable(f => f.Mode(GridFilterMode.Menu))
        .Scrollable()
        .DataSource(dataSource => dataSource

            .Ajax()
            .Model(model => {
                model.Id(p => p.Id);
                model.Field(p => p.DepartureCountry).Editable(false);
                model.Field(p => p.ArrivalCountry).Editable(false);
            })
            .Read(read => read.Action("Getxxx", "xxx", new { companyId = ViewBag.CompanyId }))
            .Update(update => update.Action("Updatexxx", "xxx", new { companyId = ViewBag.CompanyId }))
            )

）

Answer 1

这是开箱即用的，因为kendo使用基本CSS文件的方式，用你选择的单个主题CSS文件覆盖部分文件。在kendo forum上讨论了这个问题，Telerik团队提出了可能的解决方案。他们引用以下理由不支持开箱即用：

虽然实现很简单，但会导致CSS文件的大小和复杂性大幅增加。

在单个页面上使用多个主题很少见。大多数开发人员不会从这个功能中受益，反之亦然。

可以通过在iframe或frameset中托管您的网格来解决此问题，您可以将CSS导入完全分开（请注意，我没有尝试过这种方法！）。当然，根据您的情况，由于需要在帧之间进行通信，这可能会引入更复杂的问题。希望这会有所帮助。

Answer 2

您可以单独使用每个视图的上面的主题参考，而不是在每个视图中使用您喜欢的布局和参考。不推荐，但我认为这是一种方式

Kendo UI MVC Grid主题更改

2 个答案: