This question is locked. New answers and comments are not allowed.
I have made several attempts to update the icon of a Kendo UI button widget at runtime. I can update the button text easily via Kendo binding or Angular.js binding and I can update the data-icon attribute value via several different methods but I cannot actually get the button to "refresh / redraw" itself so that the new icon is shown. Do you have any tips on how to do this?
2 Answers, 1 is accepted
0
Hello Keith,
Kendo data binding works with data models. The model is an entity which has some data and methods to work with this data. You can bind some/all the fields of the model to your view. In your case this is the icon. However, in order to change a value. you should not directly change the data attribute itself, but instead change the corresponding field in the data model using its setter method. Then the Kendo MVVM framework automatically updates the UI.
Please review this sample for further details.
If you don't want to use models for some reason and still want to directly replace the icon, you can achieve this by removing the css class added for your current icon and adding a new one for your new icon. Please refer to this sample for more details.
Kind regards,
Ivan K. Ivanov
the Telerik team
Share feedback and vote for features on our Feedback Portal.
Want some Kendo UI online training - head over to Pluralsight.
Kendo data binding works with data models. The model is an entity which has some data and methods to work with this data. You can bind some/all the fields of the model to your view. In your case this is the icon. However, in order to change a value. you should not directly change the data attribute itself, but instead change the corresponding field in the data model using its setter method. Then the Kendo MVVM framework automatically updates the UI.
Please review this sample for further details.
If you don't want to use models for some reason and still want to directly replace the icon, you can achieve this by removing the css class added for your current icon and adding a new one for your new icon. Please refer to this sample for more details.
Kind regards,
Ivan K. Ivanov
the Telerik team
Share feedback and vote for features on our Feedback Portal.
Want some Kendo UI online training - head over to Pluralsight.
0
Keith
Top achievements
Rank 2
Rank 2
answered on 26 Feb 2013, 02:30 AM
Thanks so much for the quick response. The model method works great but only if you plan to use Kendo's MVVM system. I am planning to use the Kendo UI controls with an AngularJS MVVM system since the AngularJS notation seems to be more better suited for what I need (and also comes a little more natural to me). I was able to easily get my test AngularJS app to update the icon by replacing the class name (i.e. your second option). I may give Kendo's MVVM system another try but AngularJS is going to be tough to compete with. Thanks again for the help and keep up the great work on these tools!