This is a migrated thread and some comments may be shown as answers.

CSS Data Binding

5 Answers 227 Views
Button
This is a migrated thread and some comments may be shown as answers.
Jeremy
Top achievements
Rank 1
Jeremy asked on 22 Jul 2015, 08:49 PM

Does the css data binding work with kendo buttons? 

<button type="button"
aria-label="Thumbs up"
data-role="button"
data-bind="events: { click: thumbsUp }, css:{k-state-active: isThumbsUp}">
<i class="icon-thumbs-up icon-large"></i>
</button>

5 Answers, 1 is accepted

Sort by
0
Alexander Popov
Telerik team
answered on 24 Jul 2015, 11:23 AM
Hi Jeremy,

This behavior is expected, because the CSS bindings work for regular HTML elements only. In this case however, the button has a data-role="button" attribute, which means it is treated as a widget. As a workaround you can remove the data-role attribute and manually add the "k-button" class to get the same appearance (see example here).

Regards,
Alexander Popov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Richard
Top achievements
Rank 1
answered on 06 Sep 2017, 11:05 PM

Took me a couple days to find this post about kendo buttons and data-bind css.

This useful information would be very helpful in the documentation at http://docs.telerik.com/kendo-ui/framework/mvvm/bindings/css

 

0
Ivan Danchev
Telerik team
answered on 08 Sep 2017, 12:28 PM
Hello Richard,

Thank you for the feedback. We agree that having this information in the documentation can make more clear the use of CSS binding, so we will update the documentation accordingly. 

Regards,
Ivan Danchev
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Brian
Top achievements
Rank 1
answered on 09 Jan 2020, 04:47 PM
I have not seen an update to the documentation stating that css binding only works for non-widget elements.  Had it been there, I would have saved myself valuable time.
0
Ivan Danchev
Telerik team
answered on 13 Jan 2020, 12:39 PM

Brian,

Thank you for the feedback.

We will add a note to the CSS Binding article, which will outline that the CSS binding works only for Html elements and not for widgets.

Regards,
Ivan Danchev
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
Button
Asked by
Jeremy
Top achievements
Rank 1
Answers by
Alexander Popov
Telerik team
Richard
Top achievements
Rank 1
Ivan Danchev
Telerik team
Brian
Top achievements
Rank 1
Share this question
or