Dynamically Change widget Style attributes

2 posts, 0 answers
  1. Jonatan
    Jonatan avatar
    14 posts
    Member since:
    Feb 2014

    Posted 12 Jan Link to this post

    I have browsed around and found several thread, concluding that style binding an kendo MVC widget is just not supported.

    Example of style binding: $('#kendoWidgetID').attr("data-bind", "style : { backgroundColor : modelColorAttribute } ");

    I have, however, been unable to determine the following.

    1: Is it in the works? Or will it be?

    2: If style binding is not supported on kendo MVC Widgets, then how on earth am I meant to dynamically change the styles of my kendo widgets on my grid popup, depending on my selected model properties?

     

     
     
  2. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 14 Jan Link to this post

    Hello Jonatan,

    Generally, the Kendo UI MVC wrappers are not designed to be integrated with the Kendo UI MVVM framework, because the wrappers are not meant to provide easy or complete control over the widgets' HTML output. This is explained in the documentation:

    http://docs.telerik.com/kendo-ui/intro/installation/markup

    http://docs.telerik.com/kendo-ui/aspnet-mvc/kendo-ui-vs-mvc-wrappers

    We do not plan enhancing the MVC wrappers with MVVM capabilities, because the two techniques are too different.

    A possible way to achieve the desired behavior is to use the Grid's edit event and customize the styling of the popup edit form content programmatically.

    http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-edit

    You can also use the edit event to attach some additional event handlers to manipulate the edit form when/if needed.

    An alternative approach is to include HTML elements with MVVM data attributes in the editor template for the desired field. These bindings will work.

    http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/editor-templates

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
Back to Top