【问题标题】:Difference between Kendo UI Web and Kendo UI ASP.NET for MVCKendo UI Web 和 Kendo UI ASP.NET for MVC 之间的区别
【发布时间】:2013-10-18 23:36:04
【问题描述】:

通过 Visual Studio 创建 MVC 项目时,会使用“.cshtml”文件创建视图。

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

两者有什么区别?我只是不了解 KendoUI Web 概念以及它是如何工作的。自适应渲染如何创建“.cshtml”文件的多个副本以在特定设备上渲染。 KendoUI Web 是如何实现的?

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

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

【问题讨论】:

    标签: jquery asp.net-mvc-4 kendo-ui telerik-mvc


    【解决方案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 wrappersKendo UI Web 的更多详细信息。

    【讨论】:

    • 我已经使用服务器包装器完成了一个生产项目。但是,我发现困难的是当您需要使用服务器包装器处理事件时(例如 OnItemDataBound 用于网格检查每条记录并对其进行处理等)。所有示例均使用 KendoUI Web。此外,我不知道如何使用 jquery 对 mvc 包装器对象做任何事情,因为我不知道选择器名称是什么。使用 KendoUI 网络,您实际上为扩展命名并知道它是什么。关于如何使用服务器包装器了解扩展选择器的任何建议?
    • demos.kendoui.com/web/grid/events.html docs.kendoui.com/api/web/grid#events 如果您有具体问题,很容易为您提供帮助
    【解决方案2】:

    嗯,HaBo 基本上都说了。服务器包装器非常适合那些(像我一样)在编码时喜欢“懒惰”的人。我更喜欢用包装器做事的流利方式,而不是纯 javascript 方式。

    也就是说,您应该牢记 KendoUI MVC 包装器并不是灵丹妙药。如果您不了解 javascript,您可能会发现自己对使用 KendoUI 框架可以做什么感到茫然。

    对我来说,我一直在使用包装器和 javascript(例如,使用“事件”)来做更多“高级”事情之间找到平衡。 :)

    【讨论】:

      【解决方案3】:

      我知道这是一个相当老的问题,但我认为我的回答会增加价值(因为它包含更新的信息)。

      Telerik 的文档中有 this page 很好地解释了 Kendo-UI 与其服务器端包装器(尤其是 ASP.NET MVC 包装器)之间的比较。

      另外,关于选择器名称,实际上包装器要求您指定一个名称(将呈现为元素的id 属性)。 Telerik 的文档和论坛也有一些必要的 CSS 选择器,您可以在必要时使用 CSS。你只需要用谷歌搜索它。例如,here 是您可以找到 CSS 选择器以修改 Kendo Grid 标头行为的页面。

      希望对你有帮助

      【讨论】:

        猜你喜欢
        • 2012-11-24
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多