guys trying make relations between switch buttons.each button represents device. example, if turn off x device turn off y , z. in case y off turn couple more. tried switch case statement code getting messy. tried find if javascript library no results. idea?
function hm1() { var hlektro1 = document.getelementbyid("device_engine1").checked; switch (hlektro1) { case (hlektro1 = true): document.getelementbyid("device_x").checked = false; document.getelementbyid("device_1").checked = false; document.getelementbyid("device_nautical").checked = false; document.getelementbyid("device_2").checked = false; break case (hlektro1 = false): document.getelementbyid("device_x").checked = true; document.getelementbyid("device_1").checked = true; document.getelementbyid("device_nautical").checked = true; document.getelementbyid("device_2").checked = true; break } } function gps() { var gpsdevice = document.getelementbyid("device_x").checked; switch (gpsdevice) { case (gpsdevice = true): document.getelementbyid("device_55").checked = false; document.getelementbyid("device_123").checked = false; document.getelementbyid("device_nautical").checked = false; document.getelementbyid("device_camera").checked = false; document.getelementbyid("device_14").checked = false; break case (gpsdevice = false): document.getelementbyid("device_55").checked = true; document.getelementbyid("device_123").checked = true; document.getelementbyid("device_nautical").checked = true; document.getelementbyid("device_camera").checked = true; document.getelementbyid("device_14").checked = true; break } }
sample of switch button:
<div class="onoffswitch"> <input type="checkbox" name="engine1" class="onoffswitch-checkbox" id="device_Ηλεκτρομηχανη1" checked> <label class="onoffswitch-label" for="device_engine1" onclick="hm1()"> <span class="onoffswitch-inner"></span> <span class="onoffswitch-switch"></span> </label> </div>
add id
dependend checkboxes class
.
, on change
of "controlling" checkbox dependend checkboxes , set checked
state accordingly.
something this:
document.queryselector("#control").addeventlistener("change", function(e) { var checkbox = e.target, dependendcheckboxes = document.queryselectorall("." + checkbox.id); (var = 0; < dependendcheckboxes.length; i++) { dependendcheckboxes[i].checked = checkbox.checked; } });
<div id="control"> <label><input type="checkbox" id="device_engine1" />device_engine1</label> <label><input type="checkbox" id="device_x" />device_x</label> </div> <div> <input type="checkbox" class="device_engine1" /> <input type="checkbox" class="device_x" /> <input type="checkbox" class="device_engine1 device_x" /> </div>
Comments
Post a Comment