Questions on Kendo UI for jQuery Forum

13 answers

311 views

Hello,

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.

Thank you!

Switch (Mobile)

answered on 29 Mar 2018

3 answers

291 views

Long custom labels

Is it possible to have onLabel and offLabel that is longer than three characters? I'm using the mobile switch on a web page with the silver theme and it appears that if I make the labels more than three characters it bleeds over into the other label. Try it out yourself click on the "Edit this sample" button here http://demos.telerik.com/kendo-ui/switch/adaptive and change the onLabel or offLabel to "XXXXXXXX" or something long and you will see what I'm talking about. What I'm trying to accomplish is to get rid of the corresponding labels that you would put next to the control and just show that toggled text in the control itself. For example I want a switch with the onLabel="Edit Mode" and offLabel="View Mode".

Switch (Mobile)

answered on 08 Feb 2018

1 answer

523 views

Longer "on" and "off" labels

Hi, seems like the switch cuts down display of labels to about three characters or so.

Is there a way to resize the switch to hold more than three characters on either side of the display? I tried playing around with the css components, but it ends up messing up the switch layout.

Also, both on and off labels get capitalized automatically, I'd like them retain their original format

Here's the code I am using

$("#switch").kendoMobileSwitch({<br> onLabel: "My On Label",<br> offLabel: "My Off Label",<br> change: onChange<br> });

<p><div></p><p> <input id="switch" checked="checked"/><br></div></p>

Thanks,

Labhesh

Switch (Mobile)

answered on 25 Jan 2018

2 answers

200 views

Switch validation message does not dissappear

Hello. I noticed a bug where the validation message does not disappear for the mobile switch, but does for a regular switch.

Dojo: http://dojo.telerik.com/ISuvI

Can you fix this please?

Switch (Mobile)

answered on 18 Oct 2017

2 answers

233 views

How to use the switch in a custom build?

We were orginally using the "all" build of kendo UI for our application, but recently started using the the custom compilation Telerik provides with a gulpfile.

We're using a mixing and matching components, using primary the non-mobile stuff, however, we do use the switch, but ever since we changed over to the custom build, we can not longer use the switch component, even though it's included in the build.

It's probably some initialization code that we're not including, but we're not sure.

When we try:

$(element).kendoMobileSwitch( ... )

we get:

Uncaught TypeError: $(...).appendTo(...).kendoMobileSwitch is not a function

Here's the gulp command we run to do the custom build:

gulp custom -c autocomplete,binder,button,calendar,color,colorpicker,columnmenu,columnsorter,combobox,core,data,data.xml,dateinput,datepicker,datetimepicker,dialog,dom,draganddrop,drawing,dropdownlist,editable,excel,filebrowser,filtercell,filtermenu,fx,grid,groupable,imagebrowser,list,listbox,listview,maskedtextbox,mediaplayer,menu,mobile,mobile.application,mobile.button,mobile.collapsible,mobile.drawer,mobile.loader,mobile.scroller,mobile.scrollview,mobile.shim,mobile.view,mobile.switch,multiselect,notification,numerictextbox,ooxml,pager,panelbar,popup,progressbar,reorderable,resizable,responsivepanel,router,selectable,slider,sortable,spreadsheet,tabstrip,timepicker,timezones,toolbar,tooltip,touch,upload,userevents,validator,view,virtuallist,web,window

Switch (Mobile)

answered on 07 Jul 2017

1 answer

61 views

No how do I pass on or off to my form using the "kendo.mobile.ui.Switch"

Okay, been working with this one for about 20 mins and I'm not sure what's going.

I've got a kendo Switch which I enable like so on my page inside using an MVVM framework.

The switch renders find, but no matter if I have it on or off is just sends "on" to my form as a value.

How do I get it to send off please?

Philip

Switch (Mobile)

answered on 24 Mar 2017

2 answers

152 views

Switch custom image

Hello,

can I somehow set the custom image for a switch? I would like to have something like the 2 attached files instead of a default switch with labels.

If not possible, I would use an observable array that changes images using hidden checkboxes. Or is there a better solution?

Thanks

Switch (Mobile)

answered on 28 Feb 2017

2 answers

157 views

Use the Mobile Switch within regular MVVM framework

Hi --

I've been trying to get a "switch" of any kind to work with the regular MVVM framework -- it's a full desktop web application (not the mobile flavor).

I have tried including the mobile css, creating a new kendo.mobile.application, but nothing seems to work.

Do you have any examples of the mobile switch being used in a non-mobile application and using the MVVM framework? I'd love to see the code in a JsFiddle or something.

If you need it, I can try to create a non-working fiddle with what I'm after -- but it's really just a multi-field form, where one/more of the fields is a switch -- and uses the MVVM framework and NOT a mobile application.

Any assistance is appreciated -

Erik

Switch (Mobile)

answered on 08 Feb 2017

2 answers

539 views

How do I intercept the switch's event handlers?

Hi,

What is the recommended way to intercept the switch's event handlers?

I'd like a confirmation dialog to appear whenever the user clicks the switch, and change the switch value only after the user confirms 'yes'. So the first step is for me to intercept the default click behavior for the switch.

Here's what I tried:

<div id='switch-section'>

<input type='checkbox' />

</div>

$('#switch-section input').kendoMobileSwitch();

var switch = $('#switch-section .km-switch');

switch.on('click', function (e) {

console.log('click');

e.preventDefault();

return false;

}

When I click the switch, this prints the expected message to the console. However, I also expected this to prevent the switch from changing value, but that is not the case.

Switch (Mobile)