Switch not working at all

[rootberg]

Am I missing something?  I cannot get this control to work at all. I first tried making a simple switch:

@Html.Kendo().MobileSwitch().Name("​MySwitch").Checked(true).OnLabel("Label On").OffLabel("Lable Off")

All I get is a check box. So then I tried the  sample on the demo site, and that also did not work.

 I am using MVC4 on VS 2015 and I used the "Configure Project" wizard to add "Asp.Net MVC" to the project.

 

[rootberg]

I forgot to say that I am using version 2015.3.930

[Alexander Valchev]

Hi rootberg,

Are you sure that you have included the required CSS files as described in this help topic?


Regards,
Alexander Valchev
Telerik

[rootberg]

Hi Alexander, Thank you for the info, but that is the Kendo documentation, not the ASP.NET MVC documentation.

I checked the ASP.NET MVC documentation but it did not describe any additional steps that I need to take to get the control to work.

I did examine how the kendo widget works, and then examined the resultant code/markup that is being generated by Asp.Net MVC. and it would appear all that is being rendered by  Asp.Net MVC is a checkbox:

<input name="​MySwitch" id="MySwitch" type="checkbox" checked="checked" data-role="switch" data-on-label="Label On" data-off-label="Lable Off" data-enable="false">

Now if I manually type all the Kendo code,  everything is fine, but the point of the MVC wrapper is that it does that for me.

 

[Alexander Valchev]

Hi rootberg,

It is not possible to initialize Kendo Mobile widgets with MVC wrappers outside of a mobile application.
The reason is that Mobile MVC wrapper produces pure HTML and no JavaScript code. As a mobile application instance is missing, its features (declarative widget initialization) will not work, hence the switch will not be initialized and the end user will see standard check box.

Regards,
Alexander Valchev
Telerik

[Chris]

Hey rootberg, not sure if you figured this out yet. But i was wrestling with this issue as well. The whole point is to use the MVC wrappers to make your life easier right?

I referred to this post: http://www.telerik.com/forums/switch-only-rendering-checkbox 

And it helped!

The trick is to instantiate the MobileSwitch inside the content section of a MobileView, and then initialize the MobileView via MobileApplication referencing the div. 

The only other thing that i had to do was make sure the correct kendo.[theme].mobile.min.css stylesheet was included in the _layout.cshtml, since these are not included in the core kendo css files. I am including it dynamically based on a dropdownlist, so i dont explicitly set the link property. I am doing that in some js code.

It seems like a lot of work compared to the regular MVC wrappers, but technically its a Hybrid UI control so the implementation is different. Wish it was easier, but at least this works!

Let me know if works out for you.