Crestron Components Lib - Showcase App

ch5-toggle: change event

ch5-toggle change event

Open the browser console to see the result of a Javascript event handler when the ch5-toggle is changed . ( See JS tab )

Preview

HTML
JS
CSS

<ch5-toggle
    id="demo"
    label="Alarm"
    labelOn="On"
    labelOff="Off"
    >
</ch5-toggle>

var elem = document.getElementById("demo");  

elem.addEventListener('change', function(e){
    console.log('ch5-toggle change event via javascript with event detail: ', e.detail);
});

Execute JS before HTML

Open the browser console to see result of a jQuery event handler when the ch5-toggle is changed . ( See the JS tab )

Preview

HTML
JS
CSS

<ch5-toggle
    id="demo2"
    label="Speaker"
    labelOn="On"
    labelOff="Off"
    handleShape="rectangle"
    >
</ch5-toggle>

$('#demo2').on('change', function(e) {
    console.log('ch5-toggle change event via jquery with event detail: ', e.detail)
});

Execute JS before HTML