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>