DHTMLX Docs & Samples Explorer

### Radio Buttons And Checkboxes Event Handling

Menu contains sub items with checkboxes and radio buttons. Try to change their states.

Source

    <link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxmenu_dhx_skyblue.css">
    <script src="../../codebase/dhtmlxcommon.js"></script>
    <script src="../../codebase/dhtmlxmenu.js"></script>
    <script src="../../codebase/ext/dhtmlxmenu_ext.js"></script>

    <div style="height: 250px;"><div id="menuObj"></div></div>
    <div id="ta" style="width: 500px; height: 100px; border: #909090 1px solid; overflow: auto; font-size: 10px; font-family: Tahoma;"></div>

    <br>
    <script>var menu;
    function initMenu() {
        menu = new dhtmlXMenuObject("menuObj");
        menu.attachEvent("onCheckboxClick", menuCheckboxClick);
        menu.attachEvent("onRadioClick", menuRadioClick);
        menu.loadXML("../common/dhxmenu_radios.xml?e=" + new Date().getTime());
    }
    function menuCheckboxClick(id, state) {
        document.getElementById("ta").innerHTML += "Checkbox '" + menu.getItemText(id) + "' (id:" + id + ") was " + (state ? "unchecked": "checked") + "<br>";
        return true;
    }
    function menuRadioClick(group, idChecked, idClicked) {
        document.getElementById("ta").innerHTML += "Radiobutton '" + menu.getItemText(idClicked) + "' (id:" + idClicked + ") was checked<br>";
        return true;
    }</script>