We would like to use the mobile switch without doing an entire mobile application (i.e. within an HTML5/CSS3 application using Kendo Web UI). I have managed to determine the minimum integration with Kendo Mobile to get a switch control to work, but unfortunately, by running new kendo.mobile.Application, it affects other controls, like kendo drop-down-lists (see the attached graphic for a sample of what happens to a kendo drop-down list).
I tried localizing the scope of the effects by defining a <div> just around the switch and calling new kendo.mobile.Application($("#divAroundTheSwitches")), but this didn't work -- no switches were created.
Is it feasible to try to use mobile platform widgets in a non-mobile HTML5/CSS3 application? Any direction you could give would be greatly appreciated.
13 Answers, 1 is accepted
the looks of the switch are defined in the web skin; indeed, they are different from the iOS theme. There is no "easy way" to move the look in the iOS theme here, apart from modifying the CSS file.
I followed the instructions on the linked article. When including the necessary .css files, for instance "kendo.silver.mobile.min.css", the styling of Kendo UI web components are messed up. The "kendo.silver.mobile.min.css" stylesheet file contains styling for all components and thus breaks styling of web components.In my case I would like to use the Switch component in a Kendo UI web application but I don't want to include all mobile styling because of this. Suggestions?
I am not quite sure which are the components you are using along with the Switch. Also your query addresses issues related to the specific scenario you have.
Due to that and the fact that this thread is 1 year old, I suggest you to open a new thread or send us a ticket with more details about the specific situation. Also, it would be greatly appreciated if you can create a Dojo (http://dojo.telerik.com/) which to demonstrate the exact issue and enable us to define better what the problem is and further suggest you possible resolutions.
Telerik by Progress
Never mind Lanko, it turns out that there was something wrong with our .css generation from the .less source files. Themes got mixed up, but we have figured out what was wrong on our end.
To add Kendo UI Mobile Switch to Grid you should use a column.template and initialize the widget in the dataBound event. Take a look at the following example:
Telerik by Progress
I am also trying to use the switch in a non-mobile application. How should I access the events and switch state?
Here you are a dojo example: https://dojo.telerik.com/uzElUtuh.