dropdown change event does not update the value

2 Answers 690 Views
DropDownList
Claudia
Top achievements
Rank 1
Claudia asked on 15 Jan 2020, 07:32 PM

I am using a dropdown list that based on the selected item a second dropdown need to be cleared. Selecting an item from the UX fires the change event of the first dropdown and the second one will be cleared only if I trigger the change event manually. If I do that the value of the first dropdown does not get updated. I used select(-1) and value ("-1") and same behavior. Here is my code, I will appreciate any hint on this.

$("#ddl1").kendoDropDownList({
        dataSource: [
            { value: "1", text: "Option1", priority: 0 },
            { value: "2", text: "Option2", priority: 1 },
            { value: "3", text: "Option3", priority: 1 }
        ],
        dataTextField: "text",
        dataValueField: "value",
        optionLabel: { value: "", text: "-- Select one --" }       
    }).change(function (e) {
        var ddl2 = $("#ddl2").data("kendoDropDownList");
        if (this.value == "1") {
            ddl2.value("-1");
            //ddl2.select(-1);
            //ddl2.trigger('change'); //with this value of ddl2 is cleared ("-- Select one --") and value of ddl1 does not change
        }
        else {
            /**/
        }       
        validateSection(4);
        });
         
$("#ddl2").kendoDropDownList({
        dataSource: [
            { value: "Y", text: "Yes" },
            { value: "N", text: "No" },
            { value: "NA", text: "Refused to answer" }
        ],
        dataTextField: "text",
        dataValueField: "value",
        optionLabel: { value: "", text: "-- Select one --" },
    }).change(function (e) {
        validateSection(4);
    });

2 Answers, 1 is accepted

Sort by
0
Petar
Telerik team
answered on 17 Jan 2020, 02:26 PM

Hi Claudia,

I've tried to reproduce the reported behavior in this Dojo example but without success. The values of the DropDownLists seem to be changing as expected. You can see in the console what are the values of each the DropDownLists once one of them changes its value. 

What I've modified compared to the code you've shared is to comment on the execution of the "validateSection" function and add logging of the DropDownLists' values in the console. Based on my changes and the behavior in the linked above Dojo, I would assume that this function could be breaking the logic.

If I am missing something and the linked Dojo doesn't represent the functionality you want to achieve, give more details about how the DropDownLists' values should be changing. 

Regards,
Petar
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Claudia
Top achievements
Rank 1
answered on 17 Jan 2020, 09:05 PM

Hi

Thank you for your assistance. I found that the problem was the binding. Both dropdowns value are part of  an observable obj . So it was getting updated 2 times keeping the original value. I just updated it in the observable datasource in the change event of each dropdown and is working.

Thank you

Petar
Telerik team
commented on 20 Jan 2020, 08:08 AM

Hi Claudia,

I am happy to hear that you've managed to resolve the issue! Thank you for sharing what was the case in your scenario.

For sure, this information will be useful for someone else in the future. 

Regards,
Petar
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
DropDownList
Asked by
Claudia
Top achievements
Rank 1
Answers by
Petar
Telerik team
Claudia
Top achievements
Rank 1
Share this question
or