This is a migrated thread and some comments may be shown as answers.

How do I intercept the switch's event handlers?

2 Answers 133 Views
Switch (Mobile)
This is a migrated thread and some comments may be shown as answers.
Larisa
Top achievements
Rank 1
Larisa asked on 07 Oct 2016, 06:15 PM

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.

2 Answers, 1 is accepted

Sort by
0
Larisa
Top achievements
Rank 1
answered on 07 Oct 2016, 06:30 PM
I could set the 'pointer-events' CSS property to 'none' for the .km-switch element, and then programmatically toggle the switch, but was wondering if there's a better way.
0
Ianko
Telerik team
answered on 11 Oct 2016, 07:17 AM

Hello Larisa,

 

You can use the change event and modify the state with the check method of the switch based on the results of the confirm dialog. Here you are an example of that: http://dojo.telerik.com/EXIpA

 

Regards,
Ianko
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
Tags
Switch (Mobile)
Asked by
Larisa
Top achievements
Rank 1
Answers by
Larisa
Top achievements
Rank 1
Ianko
Telerik team
Share this question
or