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. Image for the cookie policy date
close icon

Ribbon toggle-button

Hi
I have the follow toggle-button

    <e-content-group id="connect" tool-tip="Connect to APRS Server" type="ToggleButton">
                                                <e-toggle-button-settings click="onConnect" content-type="TextAndImage" default-text="Connect" default-prefix-icon="agw-disconnect" active-text="Disconnect" active-prefix-icon="agw-connect" image-position="ImageTop">
                                                </e-toggle-button-settings>
                                            </e-content-group>

How can i change its state from javascript?
The situation is as follow. When the user clicks opens a modal and the user either continue with the connection or just presses cancel and stays disconnected.
The button when the user click it changes state. I want to set it to unselected when the user clicks Cancel.
Thank you in advance for any help.
George

1 Reply

PK Pradeep Kumar Bose Syncfusion Team January 2, 2017 01:07 PM UTC

Hi George, 
 
Query : When the user clicks opens a modal and the user either continue with the connection or just presses cancel and stays disconnected.  
 
The requested requirement “ Changing toggle button state” can be achieved using toggle button client side event. 

 
//Here you can define toggle button click event ‘onConnect’. 

<e-content-group id="undo" > 
                           <e-toggle-button-settings id="tglbtn" click=" onConnect”  show-rounded-corner="true" default-text="Connect" active-text="Connected" /> 
      </e-content-group> 



//script section for Toggle button state change. 
 
 
<script> 
        function onConnect(e) { 
            var r = confirm("Connect or not");                           
    if (r == false) { 
                this.option('toggleState', false); 
            }  
 } 
</script> 
 
 
You can check the following api documentation link of toggle button. 
 
 

For your convenient we have attached sample. 



Loader.
Live Chat Icon For mobile
Up arrow icon