配置Kendo发出的Ajax请求以支持跨域Ajax请求

问题描述：

基本的kendo自动完成示例显示了一种设置，其中通过Ajax请求获取匹配的搜索结果.如果请求的资源在同一域中，则ajax加载工作正常，但是我想知道是否支持配置基础ajax请求以支持CORS.有没有一种方法可以像通常直接使用$.ajax({})一样传递Ajax选项.

The basic kendo auto complete example shows a setup where matched search results are fetched through an Ajax request. The ajax loading works fine if the requested resource is on the same domain, but I was wondering if there is support for configuring the underlying ajax requests to support CORS. Is there a way to pass in Ajax options like you normally would do if you were using $.ajax({}) directly.

$("#products").kendoAutoComplete({
                        dataTextField: "ProductName",
                        filter: "contains",
                        minLength: 3,
                        dataSource: {
                            type: "odata",
                            serverFiltering: true,
                            serverPaging: true,
                            pageSize: 20,
                            transport: {
                                read: "http://demos.kendoui.com/service/Northwind.svc/Products"
                            }
                        }
                    });
                });

我基本上希望对请求的控制与常规JQuery Ajax请求中的控制相同(例如下面的示例):

I basically want the same granular control over the request as in a regular JQuery Ajax request (example bellow):

 jQuery.ajax({
                url: 'some url',
                data: {id:id},
                contentType: 'application/json',
                type: "Get",
                xhrFields: {
                    withCredentials: true
                },
                crossDomain: true

            })

答

解决方案是将read属性分配给包装ajax调用的方法，如下所示:

The solution is to assign the read property to a method that wraps the ajax call like so:

$("#search").kendoAutoComplete({
        dataTextField: "Name",
        minLength: 1,
        dataSource: {
            type: "json",
            serverFiltering: true,
            transport: {
                read:
                    function(options) {
                        $.ajax({
                            url: "someUrl",
                            contentType: 'application/json',
                            data: { text: options.data.filter.filters[0].value },
                            type: "Get",
                            xhrFields: {
                                withCredentials: true
                            },
                            crossDomain: true,
                            success: function (result) {
                                 options.success(result);
                            }
                        });
                    }
                }
            }
        }
    });

这使您能够替换默认的ajax行为.

This gives you the ability to replace the default ajax behavior.

配置Kendo发出的Ajax请求以支持跨域Ajax请求

相关推荐