javascript - how do I suppress certain HTML input fields based on drop down selection? -
hypothetical situation:
i have form has 11 fields, fields 1 through 11.
let's field 1 drop down 3 values: "a", "b", "c"
how use html/javascript that:
if user selects "a", fields 2,3,4 editable (the rest not)
if user selects "b", fields 5,6,7,8 editable (the rest not)
if user selects "c", fields 9,10,11 editable (the rest not.
thanks!
var selectcontrol = [['input1', 'input2', 'input3'], ['input4', 'input5', 'input6', 'input7'], ['input8', 'input9', 'input10', 'input11']]; var formcontrol = { init: function () { var myform = document.getelementbyid("myform"); var myselect = myform.getelementsbytagname('select')[0]; var defaultoption = myselect.value; myselect.addeventlistener('change', formcontrol.changeselect, false ); // first load formcontrol.changefields( defaultoption ); }, changeselect: function ( event ) { var option = this.value; formcontrol.changefields ( option ); }, disableallinputs: function ( ) { var myform = document.getelementbyid("myform"); var inputs = myform.getelementsbytagname("input"); ( var = 0; < inputs.length; i++ ) inputs[i].disabled = true; }, changefields: function ( optionselected ) { var enableinputs = selectcontrol[optionselected]; // disable formcontrol.disableallinputs(); // enable ones selected ( var = 0; < enableinputs.length; i++ ) document.getelementbyid( enableinputs[i]).disabled = false; } }; formcontrol.init();
Comments
Post a Comment