CORS Support

2 posts, 0 answers
  1. William
    William avatar
    1 posts
    Member since:
    Nov 2013

    Posted 11 Mar 2014 Link to this post

    Hi,
       I have a problem getting the Hierarchical Data Source to work with a CORS configured WebAPI server whereas a standard Data Source works fine for a grid.  My sample code for a working grid on a CORS data source is as follows:

    var buildTestGrid = function () {
            // Setup Data Source
            var ds = new kendo.data.DataSource({
                transport: {
                    read: function (options) {
                        console.log("Setting-up testGrid");
                        console.log("Token: " + token);
                        $.ajax({
                            cache: false,
                            url: getUrl("api/v1/items(parent_id=null,is_template=false)"),
                            type: "GET",
                            headers: { "X-Token": token },
                            success: function (response) {
                                console.log("Test Grid... it's ALIVE!");
                                if (response == null || response == "null")
                                    console.log("ERROR: No response");
                                else {
                                    options.success(response);
                                }
                            },
                            error: function (xhr, status, error) {
                                console.log("Test Grid Error");
                            },
                        });
                    },
                    batch: true
                },
                pageSize: 10
            });


            // Now configure the grid
            $("#testGrid").kendoGrid({
                dataSource: ds,
                groupable: false,
                sortable: true,
                pageable: {
                    refresh: true,
                    pageSizes: true,
                    buttonCount: 5
                }
            });
        }

    However, the data source fails when building a tree control using the following code:

        var buildTestTree = function () {
            // Setup the data source
            var ds = new kendo.data.HierarchicalDataSource({
                transport: {
                    read: function (options) {
                        console.log("Setting-up testGrid");
                        console.log("Token: " + token);
                        $.ajax({
                            cache: false,
                            url: getUrl("api/v1/items(parent_id=null,is_template=false)"),
                            dataType: "json", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
                            type: "GET",
                            headers: { "X-Token": token },
                            success: function (result) {
                                console.log("Test Tree... it's ALIVE!");
                                if (result.length == 0) {
                                    console("ERROR: No response");
                                }
                                options.success(result);
                            },
                            error: function (result) {
                                console.log("Test Tree Error");
                                options.error(result);
                            }
                        });
                    },
                }
            });


            $("#testTree").kendoTreeView({
                animation: {
                    collapse: {
                        duration: 400,
                        effects: "fadeOut"
                    },
                    expand: {
                        duration: 400,
                        effects: "fadeIn"
                    }
                },
                dataSource: ds,
            }).data("kendoTreeView");
        }

    Strangely if I configure my service to just return an error message the GET request works fine, but when the tree actually get's data it appears to make a second call and gives the following error:

    OPTIONS <URL> 405 (Method Not Allowed) jquery-1.9.1.js:9597
    OPTIONS <URL> Invalid HTTP status code 405 jquery-1.9.1.js:9597
    XMLHttpRequest cannot load <URL>. Invalid HTTP status code 405 

    Thanks










  2. Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2500 posts

    Posted 13 Mar 2014 Link to this post

    Hello William,

    Can you elaborate on the problem? Does the HierarchicalDataSource fail silently, or is there a problem with how the TreeView displays the data? It would be of great help if you send a runnable sample project so that we can quickly inspect the issue.

    Regards,
    Alex Gyoshev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top