forms - Using Jquery to Disable Submit Button if an option is selected -


i have simple form 4 select fields. if yes selected on form field, submit button needs disabled , hidden div should appear. here's example of markup:

<form> have read information on product(s)<select name="field4"> <option value="yes">yes</option> <option value="no">no</option> </select>  have allergies ingredients in product(s)?  <select name="field5"><option value="yes">yes</option> <option value="no">no</option> </select>  pregnant?  <select name="field6"> <option value="yes">yes</option> <option value="no">no</option> </select>  have ever used type of product , had undesirable results?  <select name="field7"> <option value="yes">yes</option> <option value="no">no</option> </select>  <input name="cmdsubmit" type="submit" value="submit" /> </form>   <div style="display:none;">hidden div appear if of 4 dropdowns marked yes.</div> 

thanks on one. jquery novice trying best learn.

i don't understand business logic of way have form built , requirements but... going based on have said here do.

  1. write function check options, change disable/enable submit, show/hide div
  2. call function on load
  3. call function check options every time option value changes

.

checkoptions(); $("select").change(checkoptions);  function checkoptions() {   var yesfound = false;   $("select").each(function(index, element) {     if ( $(element).val() == "yes" ) {       yesfound = true;     }   });    if (yesfound) {     $("#hidden-div").show();     $("input[type=submit]").attr("disabled","disabled");   } else {     $("#hidden-div").hide();     $("input[type=submit]").removeattr("disabled");   }; } 

with modified html:

<form>   <select name="field4">      <option value="yes">yes</option>     <option value="no">no</option>   </select> have read information on product(s)<br/>   <select name="field5">     <option value="yes">yes</option>     <option value="no">no</option>   </select> have allergies ingredients in product(s)?<br/>   <select name="field6">     <option value="yes">yes</option>     <option value="no">no</option>   </select> pregnant?<br/>   <select name="field7">     <option value="yes">yes</option>     <option value="no">no</option>   </select> have ever used type of product , had undesirable results?<br/>   <br/>   <input name="cmdsubmit" type="submit" value="submit" /> </form> <div id="hidden-div" style="display:none;">hidden div appear if of 4 dropdowns marked yes.</div> 

example webpage:

http://mikegrace.s3.amazonaws.com/forums/stack-overflow/example-disable-submit-dynamically.html

on load:

alt text

all options 'no' one:

alt text

all options 'yes':

alt text


Comments

Popular posts from this blog

asp.net - repeatedly call AddImageUrl(url) to assemble pdf document -

java - Android recognize cell phone with keyboard or not? -

iphone - How would you achieve a LED Scrolling effect? -