Kendo UI dynamically changes a data source string (XML)

I have a Kendo grid that binds to an XML DataSource. How can I change the DataSource based on the selection of a drop-down list. Example:

//Create DataSource
    var gridDataSource = new kendo.data.DataSource({            
        transport: {
             read: [DropDownListValue] + ".xml",
             dataType: "xml"
        }
         });

    gridDataSource.read();

    function createGrid(){                  
            var grid = $("#grid").kendoGrid({
                dataSource: gridDataSource
                }...
             };

Where [DropDownListValue] is a dropdown list in my form. In this example, if [DropDownListValue] = 1, the data source will be "1.xml". If [DropDownListValue] = 2, then the data source will be "2.xml".

+5
source share
1 answer

I managed to do this by adding the following to the On Change event in the Drop-down list:

//Assign drop down value to variable
var dropDownListValue = $("#dropDown1").val();

//Concatenate drop down variable to file name
var dynamicUrl = dropDownListValue +".xml";

//Assign grid to variable
var grid = $("#grid").data("kendoGrid");

//Set url property of the grid data source
grid.dataSource.transport.options.read.url =dynamicUrl;

//Read data source to update
grid.dataSource.read();
+15
source

All Articles