2
votes

We have an ASP.NET MVC 5.0 application that uses both Knockout and Kendo UI. For historical reasons, we'd rather stay with Knockout rather than use Kendo's MVVM features however, we've notcied that Kendo isn't completely compatible with KO. To get around this incompatibility between the two frameworks I've been investigating the Knockout-Kendo library (v0.9.0). The Knockout-Kendo library works but I've noticed that when I use Kendo's Html Helpers the .k-input class is being applied to the outermost span that encapsulates the widget; obviously, this changes the appearance of widget and, in my view, shouldn't be happening. So far, I've not been able to find a workaround that stops the .k-input class from being applied inappropriately.

Initially, I thought the .k-input class might be being applied because I was missing some subtlety in the binding syntax that the Knockout-Kendo library uses but using "standard" KO bindings take me back to square one, Kendo widgets don't respond to all bindings. To illustrate:

<div class="form-group">
    <label for="Start">Start</label>
    @Html.Kendo()
         .DatePickerFor(m => m.Start)
         .HtmlAttributes(new { data_bind = "kendoDatePicker: {enabled: enabledFlag, value: startDate}" })
</div>

declaring a widget using this binding syntax works but inappropriately applies the .k-input class.

<div class="form-group">
    <label for="Start">Start</label>    
    @Html.Kendo()
         .DatePickerFor(m => m.Start)
         .HtmlAttributes(new { data_bind = "enabled: enabledFlag, value: startDate" })
</div>

and declaring a widget using this binding syntax, just doesn't work correctly.

So, my question is this: is it possible to use the Knockout-Kendo library with Kendo's Html Helpers or, is it only designed to be used with html input tags?

1

1 Answers

5
votes

The HTML helpers will try to initialize the widget, as will the KO binding (when bindings are applied). So, if you are using knockout-kendo, you would want to add your binding to a normal element, so that it is initialized properly with the right handlers to do two-way binding with your view model.