Hi
Using MVVM techniques I have bound a dropdown list like this (this element is sitting within a Kendo UI mobile View):
<select id="treatmentTypesSelect" name="TreatmentTypes" data-role="dropdownlist" data-bind="source: TreatmentTypes, value: TreatmentTypeId, events: { click: onTreatmentTypeChange}" data-change="onTreatmentTypeChange" data-text-field="name" data-value-field="value" required required data-required-msg="Treatment Type is required"></select>
The function onTreatmentTypeChange is defined in the bound viewModel of the View.
Using the Icenium simulator the onTreatmentTypeChange event is fired and works properly, but once deployed to an android device the event is no longer raised.
I tried changing it to this:
<select id="treatmentTypesSelect" name="TreatmentTypes" data-role="dropdownlist" data-bind="source: TreatmentTypes, value: TreatmentTypeId" data-change="onTreatmentTypeChange" data-text-field="name" data-value-field="value" required required data-required-msg="Treatment Type is required"></select>
But this does not work either.
What is the correct way to bind events (in particular the change event)?
Using MVVM techniques I have bound a dropdown list like this (this element is sitting within a Kendo UI mobile View):
<select id="treatmentTypesSelect" name="TreatmentTypes" data-role="dropdownlist" data-bind="source: TreatmentTypes, value: TreatmentTypeId, events: { click: onTreatmentTypeChange}" data-change="onTreatmentTypeChange" data-text-field="name" data-value-field="value" required required data-required-msg="Treatment Type is required"></select>
The function onTreatmentTypeChange is defined in the bound viewModel of the View.
Using the Icenium simulator the onTreatmentTypeChange event is fired and works properly, but once deployed to an android device the event is no longer raised.
I tried changing it to this:
<select id="treatmentTypesSelect" name="TreatmentTypes" data-role="dropdownlist" data-bind="source: TreatmentTypes, value: TreatmentTypeId" data-change="onTreatmentTypeChange" data-text-field="name" data-value-field="value" required required data-required-msg="Treatment Type is required"></select>
But this does not work either.
What is the correct way to bind events (in particular the change event)?
2 Answers, 1 is accepted
0
Hi Aaron,
I think that something like this should work:
Regards,
Petyo
Telerik
I think that something like this should work:
<select id="treatmentTypesSelect" name="TreatmentTypes" data-role="dropdownlist" data-bind="source: TreatmentTypes, value: TreatmentTypeId, events: { change: onTreatmentTypeChange}" data-text-field="name" data-value-field="value" required required data-required-msg="Treatment Type is required"></select>Petyo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Aaron
Top achievements
Rank 2
Rank 2
answered on 23 Sep 2013, 11:18 PM
Thanks Petyo, that works.
I had tried that but I had mistakenly left the data-change attribute (as also seen in my example) on the element when trying it.
It makes sense that the change event is more suitable than click. We just didn't pick it up on the simulator because the click event is fired using the mouse to select from the dropdown.
Cheers
Aaron
I had tried that but I had mistakenly left the data-change attribute (as also seen in my example) on the element when trying it.
It makes sense that the change event is more suitable than click. We just didn't pick it up on the simulator because the click event is fired using the mouse to select from the dropdown.
Cheers
Aaron