Remote Foreign Key Column in Kendo Grid

1
votes

I've been developing a project with Kendo UI. There is a grid in my project which consists a couple of Foreign Key columns. The workaround which Kendo team has introduced here is to use a static array for FK's.

There are hundreds of records in my grid, if I look forward like Kendo provided in their demo I should retrieve all FKs and store them in an array. This workaround has a perf issue! Imagine for a couple of 5 records it should download more than hundred and hundred of FK's.

Is there any workaround to load only foreign keys which are needed? (on-demand load).

1
jquerykendo-uikendo-grid

1 Answers

0
votes

Vladimir Iliev of Telerik demonstrates an approach to use async call.

Define column template: 

template: "#=createAsync(data)#"

Define the "createAsync" function:

function createAsync(data) {

    $.ajax({
        url: "/Home/GetCustomData",
        type: "POST",
        data: { id: data.OrderID },
        success: function (response) {
            //find the returned element and insert the response
            $("#async_" + data.OrderID).html(response.text);
        }
    });

    //return container with id generated from current model ID field
    return "<div id='async_" + data.OrderID + "'> </div>"
}