如何更新剑道网格数据源远程URL，但不会触发一个Ajax调用？剑道、数据源、网格、Ajax

2023-09-10 20:34:41 作者：年少就是不服输

看看我的这里捣鼓

Take a look at my fiddle here

不幸的是剑道电网似乎并没有提供原生解决方案，以良好的SEO（的在这里看到）。不过，我想我会尝试一下，看看有什么我能做的。这是我到目前为止有：

Unfortunately Kendo Grid doesn't seem to provide a native solution to good SEO (see here). But I thought I would give it a try, and see if there is anything I can do. This is what I have so far:

要实现与电网剑道适当渐进增强的方法，我有3个部分组成：

To achieve a proper progressive enhancement approach with Kendo Grid, I have 3 parts:

pre-现有的搜索引擎优化的目的HTML表格（看到小提琴的HTML部分的）从HTML表中的数据相同，但作为JSON（看到小提琴的爵士节的顶部的）。这将让剑道显示正确的页和总页数（它不这样做，如果我只是让它转换成HTML电网单独!!）。在随后的所有呼叫都将通过AJAX处理。（见渐进增强了我按钮上方的网格输出拨弄的） Pre-existing HTML table for SEO purposes (see html section of fiddle) The same data from the HTML table, but as JSON (see top of js section of fiddle). This is so Kendo will show the correct page and total pages (it doesn't do this if I just let it convert the HTML grid alone!!). All subsequent calls will be handled via ajax. (see "progressive enhance me" button above grid output in fiddle)

要保持一切干净整洁，我有两个生成HTML表和JSON服务器端脚本。我只是插入我的服务器端变量到我的视图（页），一切都在一起很好。

To keep everything clean and tidy, I have a server side script that generates both the HTML table and the JSON. I just insert my server side variables into my view(page) and everything comes to together well.

不过我留下了一个问题。我需要更新数据源远程URL，这表现当你preSS的渐进增强我！按钮。当按钮pssed $ P $，不必要的AJAX调用。在实际应用中，这是不必要的初始Ajax调用可能是昂贵的，其中冗余服务器端数据库查询可以减慢页面。有正在什么办法可以不更新Ajax调用的数据源？

However I'm left with one problem. I need to update the dataSource to a remote url, as demonstrated when you press the "Progressive Enhance Me!" button. When the button is pressed, an unnecessary ajax call is made. In a real application, this unnecessary initial ajax call could be costly, where redundant server-side database queries can slow down the page. Is there any way I can update the dataSource without an ajax call being made?

（我也开到什么更好的方法的建议，以实现渐进增强与剑道格）。

(I'm also open to suggestions of any better approach to achieve progressive enhancement with Kendo Grid).

myData = { 
            // some json here...see fiddle 
         };

$("#grid").kendoGrid({
    dataSource: {
        data : myData,
        dataType: "json",
        pageSize:5,
        serverPaging: true,
        serverSorting: true,        
        schema: {
            data: "results",
            total: function (data) {
                return data.__count;       
            }
        }
    },
    height: 250,
    filterable: true,
    sortable: true,
    pageable: true,
    columns: [
        {
            field:"OrderID",
            filterable: false,
            width: 75
        },
        {
            field:"Freight",
            filterable: false,
            width: 75
        },
        {
            field: "OrderDate",
            title: "Order Date",
            width: 120,
            format: "{0:MM/dd/yyyy}"
        }, 
        {
            field: "ShipName",
            title: "Ship Name",
            width: 260
        },
        {
            field: "ShipCity",
            title: "Ship City",
            width: 150
        }
    ]
});

// Button should NOT make an ajax call...I just want to update the dataSource
$("#progress-enhance-me").click(function(){                           
    var grid = $("#grid").data("kendoGrid");
    var newDataSource =  new kendo.data.DataSource({
        type: "odata",
        transport: {
            read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
        },
        schema: {
            model: {
                fields: {
                    OrderID: { type: "number" },
                    Freight: { type: "number" },
                    OrderDate: { type: "date" },
                    ShipName: { type: "string" },
                    ShipCity: { type: "string" }
                }
            }
        },
        page: 1,
        pageSize: 5,
        serverPaging: true,
        serverFiltering: true,
        serverSorting: true
    });
    grid.setDataSource(newDataSource);  
});

编辑：我试过另一种方法，使用 requestStart 通话。请参阅小提琴这里。不过，我不认为这是去工作，因为我没有办法转移的最后点击（页码点击，或排序点击顶部等），以新的数据源。

I tried another approach, using the requestStart call. See fiddle here. However I don't think this is going to work since I don't have a way to transfer the last click (page number click, or sort header click, etc) to the new datasource.

如何更新剑道网格数据源远程URL，但不会触发一个Ajax调用？剑道、数据源、网格、Ajax

推荐答案