I have a Kendo Grid that binds to an XML DataSource. How can I have the DataSource change, based off 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 drop down list on my form. In this example if [DropDownListValue] = 1, the datasource would be "1.xml". If [DropDownListValue] = 2, then datasource would be "2.xml".
I was able to achieve this by adding the following to the On Change event of my 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();
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With