jquery - Kendo UI Web 和 Kendo UI ASP.NET for MVC 之间的区别

Question

通过 Visual Studio 创建 MVC 项目时， View 是使用“.cshtml”文件创建的。

KendoUI Server Wrappers 在 View 中有一个模型，而 KendoUI Web 不仅没有任何模型，而且没有“.cshtml”文件；仅 HTML。 HTML 似乎只是指向用于数据检索/更新的数据源，而 KendoUI 服务器包装器需要一个模型来传递给 Controller ​​以进行相同类型的操作。

两者有什么区别？我只是不明白 KendoUI Web 概念及其工作原理。自适应渲染怎么样，您可以创建“.cshtml”文件的多个副本以在特定设备上渲染。 KendoUI Web 是如何实现这一目标的？

您似乎还可以使用 KendoUI Web 工具集(其名称不会更改)的选择器来使用 jQuery，而不是 KendoUI Server Wrappers。您只是不知道 KendoUI 服务器包装器中的 jQuery 选择器是什么。

我发现针对 KendoUI 服务器包装器进行编程非常困难(尽管它们应该更容易、更快地实现)，因为您需要特定扩展来处理不同的事件，并且不知道选择器的名称是。 KendoUI Web 工具集似乎并非如此。

Answer 1

简单地说，Kendo UI Web对任何可以支持javascript/jQuery的框架开放，但Kendo UI Server Wrappers/Kendo UI ASP.NET for MVC 仅适用于 ASP.NET MVC 项目。

使用 Kendo UI Web 需要大量额外的编码和处理，而 MVC版本对开发人员更友好并且更易于维护。如果您正在开发 ASP.NET MVC 项目，那么您可以使用服务器包装器简化编码。

Kendo UI Web 可以免费使用，而服务器包装器(ASP.NET MVC 的 Kendo UI)需要为每个开发人员付费许可。

剑道网格的代码差异的简单示例如下:

使用服务器包装器

@model IEnumerable<Kendo.Mvc.Examples.Models.ProductViewModel>

@(Html.Kendo().Grid(Model)    
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.ProductID).Groupable(false);
        columns.Bound(p => p.ProductName);
        columns.Bound(p => p.UnitPrice);
        columns.Bound(p => p.UnitsInStock);
    })
    .Groupable()
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Products_Read", "Grid"))
    )
)

使用 Kendo UI Web

<script>
    $(document).ready(function() {
        $("#grid").kendoGrid({
            dataSource: {
                data: createRandomData(50),
                pageSize: 10
            },
            groupable: true,
            sortable: true,
            pageable: {
                refresh: true,
                pageSizes: true
            },
            columns: [ {
                field: "FirstName",
                width: 90,
                title: "First Name"
            } , {
                field: "LastName",
                width: 90,
                title: "Last Name"
            } , {
                width: 100,
                field: "City"
            } , {
                field: "Title"
            } , {
                field: "BirthDate",
                title: "Birth Date",
                template: '#= kendo.toString(BirthDate,"dd MMMM yyyy") #'
            } , {
                width: 50,
                field: "Age"
            } ]
        });
    });
</script>

您可以检查渲染的网格here .

有关 server wrappers 的更多详细信息和 Kendo UI Web .