No change event on .select

[Karl Mikesell]

var kRegion = jQuery("#kendoRegion").kendoDropDownList({
dataTextField: "text",
dataValueField: "value",
optionLabel: {
text: "Select a Region...",
value: ""
},
dataSource: fRegions,
enable: hasValues,
index: 0,
change: onChange
}).data("kendoDropDownList");

var kCountry = jQuery("#kendoCountry").kendoDropDownList({
autoBind: false,
enable: false,
cascadeFrom: "kendoRegion",
optionLabel: "Select Country",
dataTextField: "text",
dataValueField: "value",
dataSource: []
}).data("kendoDropDownList");

kRegion.select(index);

When index is passed the onChange event does not fire.

cascade does enable kCountry, but it is the onChange event which loads the datasource for the selected kRegion; some kRegion selections may or may not have second level values.

How can the Change event be made to fire the selected option for kRegion?

Thanks 

[Georgi Krustev]

Hello Karl,

The change event of the widget is raised when the value is changed by user interaction. When widget's value is changed via API, then the change will not be triggered, as the developer knows when the value has actually been changed. The DropDownList widget has a cascade event used by the cascading functionality and it is triggered either when the value is changed by user interaction or API. If you need to perform an action in both case, then I suppose you would need to use the cascade event.

Regards,
Georgi Krustev
Telerik

 

 

[Karl Mikesell]

I was able to trigger change event this way:

kRegion.trigger("change");

Now a different problem, the cascading drop down is populated using:  ..setDataSource(new kendo.data.DataSource({ data: fTerms}));

However, the .select(index) for the cascading drop down does not work; it appears the method does not see the new DataSource (yet), the UI does display the values; just the selected index is not highlighted.   This is likely some DOM race condition.  How to use the cascade event to bind a DataSource to unsupported remote data interface? 

[Georgi Krustev]

Hello Karl,

The cascading functionality of DropDownList widget is not designed to support dynamically change of the data source components. If this is a must functionality, then I will suggest you implement the cascading widgets manually. Here is a simple demo, which shows how to use the filter option of the data source component and required widget events to create cascading widgets. 

Regards,
Georgi Krustev
Telerik

 

 

[Karl Mikesell]

I was able to get this to work with the following change to the dynamically loaded data:

var kds = new kendo.data.DataSource({ data: fTerms });
ddl.setDataSource(kds);
if (index > 0) {
kds.read();
ddl.select(index);
var element = "#" + ddl.element[0].id;
if (element == "#kendoHasAnotherLevel") {
ddl.trigger("change");
}
.
.
.

It was .read() on the DataSource which allows the .select(index) to work properly.  The .trigger("change") is required if another child level need to be populated.