Enabling/Disabling and changing values of ejs-switch, pragmatically in Jquery

[Saud Nasir]

Hi

I am developing Asp.Net Core MVC App. I am using ejs-switch for a bool ViewModel and i want to change it's value through JQuery on click of another ejs-swith control. Here is my code. Basically, i require the JQuery way to manipulate the controls because standard JQuery syntax won't work with syncfusion ej2 controls. 

<ejs-switch id="first" ejs-for="IsVendor" ></ejs-switch>

<ejs-switch id="second" ejs-for="IsCustomer" ></ejs-switch>

<ejs-switch id="third" ejs-for="IsLead" change="ToggleRoleTags"></ejs-switch>

<script type="text/javascript">

    function ToggleRoleTags(e) {

     //JQuery code here

}

</script>

on click on "third" control, i wanna enable/disable "first" control and check/un-check "second" control. I am using JQuery 3. Please help 

[Vinoth Kumar Sundara Moorthy]

Hi Saud, 

 

Thank you for contacting Syncfusion support. 

 

We have checked your reported requirement “To check/uncheck and enable/disabe the switch in change event”. And we would like to let you know that our Essential Javscript 2 controls are pure javascript components, so no need to use jquery to achieve your requirement. However, your requirement can be achievable using checked and disabled property by getting the switch instance as like in the below code example, 

 

Code Example: 

    <ejs-switch id="first" ejs-for="IsVendor"></ejs-switch> 

    <ejs-switch id="second" ejs-for="IsCustomer"></ejs-switch> 

    <ejs-switch id="third" ejs-for="IsLead" change="ToggleRoleTags"></ejs-switch> 

 

function ToggleRoleTags(e) { 

var firstInstance = ej.base.getComponent(document.querySelector("#first"), 'switch'), 

secondInstance = ej.base.getComponent(document.querySelector("#second"), 'switch'); 

secondInstance.checked = !secondInstance.checked; // check/uncheck according to your need 

firstInstance.disabled = !firstInstance.disabled;  // / enable/disable according to your need 

} 

 

For your convenience, we have prepared the sample based and the same can be found in the below link, 

 

Sample Link: http://www.syncfusion.com/downloads/support/forum/144979/ze/WebApplication1-1175169169 

 

Could you please check the above sample and get back to us, if you need any further assistance on this? 

 

Regards, 

Vinoth Kumar S