CODEWITHSUNDEEP
jqueryselenium-webdriverkendo-uionchange
Richard77
Richard77

Reputation: 21621

How to change the value of a kendo ui dropdownlist using jquery?

I've placed a Kendo UI grid inside a jQuery dialog. In the grid, I've placed some controls, such as a TinyMCE editor, Kendo dropdownlist, checkbox, an so on.

I'm trying to select an item from the kendo dropdownlist. The Kendo documentation says that this is how to select an item.

$('dropdownlistid').data('kendoDropDownList').value(index);

When I run the above code, the UI is changed accordingly. However, when I click the update button, the value sent to the server is still the one before executing the above code.

Obviously, just changing the value of the dropdownlist is not enough to set the value of the dorpdownlist sent to the server.

Also, when I manually click the dropdownlist and select a value, another dropdownlist is enabled as well. However, when I do that using the above jquery code, the other dropdownlist is not being enabled.

Maybe there is an change event that's not being raised. I really don't know what's going on with the Kendo dropdownlist.

Thanks for helping.

Upvotes: 0

Views: 1689

Answers (1)

Vanice
Vanice

Reputation: 676

The way you set the value is correct. Instead of index you have to use the item value of your datasource (like already mentioned in the comments).

After changing the value inspect the HTML. There must be an hidden input within the span which represents the dropdown. If this also shows the new value you are fine.

Also, when I manually click the dropdownlist and select a value, another dropdownlist is enabled as well. However, when I do that using the above jquery code, the other dropdownlist is not being enabled.

It looks like you have duplicate IDs on HTML elements. This can cause such strange behaviors. Also when sending the form back the server may not be able to distinct which value is correct.

Hope it helps!

Upvotes: 1

Related Questions