We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Capture switch change event and prevent value change

Thread ID:

Created:

Updated:

Platform:

Replies:

142985 Feb 27,2019 04:04 PM UTC Mar 5,2019 12:45 PM UTC ASP.NET Core - EJ 2 1
loading
Tags: Toggle Switch Button
Adam Eldred
Asked On February 27, 2019 04:04 PM UTC

Hello,

I have some switches on a page using signalR for real time updates.  I want users to be able to click a switch control and have it signal a change at the server, this part works properly with signalr.  I then want to leave the switch in its current state until the server sends back a reply that an action is complete and have that event change the switch status.  This event also works properly, but I cant figure out how to prevent the switch from toggling when initially clicked.  Is there a way to prevent the toggle when intercepting the change event?

Thanks!

Silambarasan I [Syncfusion]
Replied On March 5, 2019 12:45 PM UTC

Hi Adam, 
 
Thank you for contacting Syncfusion support. 
 
We have checked your reported requirement ‘To prevent the switch from toggling’ and it can be achievable in EJ2 Switch by using the checked property in change event as like in the below code example. 
 
CODE EXAMPLE: 
 
<ejs-checkbox id="checked" checked="false"> To Change Default behavior of Switch</ejs-checkbox> // Enable the checkbox to change the default behavior. 
<ejs-switch id="unchecked" change="onAcceptChange"></ejs-switch> 
<script> 
    function onAcceptChange() { 
        var instance = ej.base.getComponent(document.querySelector("#unchecked"), 'switch'), 
        checkInstance = ej.base.getComponent(document.querySelector("#checked"), 'checkbox'); 
        if (checkInstance.checked) { 
            $.ajax({ 
                //url: "Home/Index1", invalid url 
                url: "Home/Index", // valid url 
                method: "post", 
                success: function (result) { 
                    instance.checked = false; // set toggle state based on your condition. 
                }, 
                error: function () { 
                    instance.checked = false; 
                } 
            }); 
        } 
    } 
</script> 
 
 
For your convenience, we have prepared the sample that prevents the switch from toggling state in ajax success event based on the checkbox checked state. Please find sample link below. 
 
 
Could you please check the above sample and get back to us if you need further assistance on this? 
 
Regards, 
Silambarasan 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;