javascript - Jquery to create a disable function -

javascript - Jquery to create a disable function -

i want create disable function on select option(grant type),when select alternative form select field of form field should disabled. , selecting alternative other alternative should disabled , previous disable options has enabled.

<form action="/execomp/addexeccomp" method="post" id="adddetailsform"> < table align="center"> <tr> <td>grant type</td> <td><select name="granttype" id="grnt" /> <option value="iso">incentive stock option</option> <option value="nso">non qualified stock option</option> <option value="sb">stock bonus </option> <option value="esop">employee stock ownership plan</option> <option value="rs">restricted stock</option> <option value="rsu">restricted stock unit</option> <option value="espp">employee stock purchase plan</option> </select> </td> </tr> <tr id="iss"> <td>issuer</td> <td><input type="text" name="issuer" value="" id="iss"/></td> </tr> <tr id="date"> <td>grant date</td> <td> <input type="text" id="grantdate" name="grantdate" class="popupdate" style="display: inline;"/> </td> </tr> <tr id="nou"> <td>number of units</td> <td><input type="text" name="numberofunits" value="" /></td> </tr> <tr id="gp"> <td>grant cost ($)</td> <td><input type="text" name="price" value="" /></td> </tr> <tr id="fpu"> <td>fmv per unit ($)</td> <td><input type="text" name="fmvperunitatgrant" value="" /></td> </tr> <tr id="vt"> <td>vesting type</td> <td><select name="vestingtype" /> <option value="g">graduated</option> <option value="c">cliff</option> <option value="n">neither</option> </select> </td> </tr> <tr id="vf"> <td>vesting frequency</td> <td> <select name="vestingfrequency" /> <option value="a">annual</option> <option value="q">quarterly</option> <option value="m">monthly</option> </select> </td> </tr> <tr id="vpp"> <td>vesting % per period</td> <td><input type="text" name="vestingfractionperperiod" value="" /></td> </tr> <tr id="vd"> <td>vesting duration</td> <td><input type="text" name="vestingperiodyrs" value="" /> years</td> </tr> <tr id="set"> <td>settlement option</td> <td><select name="settlementoption" id="sett" /> <option value="c">cash</option> <option value="s">stock</option> <option value="n">not applicable</option> </select></td> </tr> <tr id="ad"> <td>annual dividend</td> <td><input type="text" name="annualcashdividendperunit" value="" />%</td> </tr> <tr id="dg"> <td>dividend growth</td> <td><input type="text" name="dividendgrowth" value="" />%</td> </tr> <tr id="cp"> <td>current price</td> <td><input type="text" name="curpriceperunit" value="" />%</td> </tr> <tr id="ar"> <td>annual return</td> <td><input type="text" name="annualreturn" value="" />%</td> </tr> <tr id="ownr"> <td>owner</td> <td> <select name="owner" /> <option value="client">client</option> <option value="spouse">spouse</option> <option value="trust">trust</option> </td> </tr> <tr id="bc"> <td>brokerage company</td> <td><input type="text" name="brokeragecompany" value="" /></td> </tr>

first need hear select event:

http://api.jquery.com/select/

next, on event, enable/disable elements need:

http://jquery-howto.blogspot.com/2008/12/how-to-disableenable-element-with.html

example:

$('#granttype').select(function() { // disable $('.someelement').attr('disabled', 'disabled'); // enable $('.someelement').removeattr('disabled'); });

javascript jquery