...

View Full Version : Disable <form> INPUT fields if not visible



stevewest15
07-15-2007, 03:20 PM
Hi,

I've modified the javascript posted (http://www.codingforums.com/showthread.php?t=24379) by forum member glenngv to allow for 3 selections. I'm wondering if anyone can help me figure out how to disable any FORM <input> fields whenever the .style.display='none';. So this way, non-visible form fields won't get submitted when the user submits the form.

Here is my modified javascript code:
function doClick(objRad){
if (objRad.value=="0"){
document.getElementById("AD").style.display='block'; //hide
document.getElementById("DD").style.display='none'; //show option
document.getElementById("NH").style.display='none'; //hide
}
if (objRad.value=="1"){
document.getElementById("AD").style.display='none'; //hide
document.getElementById("DD").style.display='block'; //show option
document.getElementById("NH").style.display='none'; //hide
}
if (objRad.value=="2"){
document.getElementById("AD").style.display='none'; //hide
document.getElementById("DD").style.display='none'; //show option
document.getElementById("NH").style.display='block'; //hide
}
}And here is my sample HTML:

<input type="radio" name="rad" value="0" onClick="doClick(this);" />
Display AD Content

<div id="AD" style="display:none">

Testing AD:
<input type="hidden" name="Product_Attributes[17]:code" value="Dom_Alias">
<input type="text" name="Product_Attributes[17]:value" value="" size=40>
</div>

<input name="rad" type="radio" onClick="doClick(this);" value="1" />
Display DD Content

<div id="DD" style="display:none">

<input type="hidden" name="Product_Attributes[18]:code" value="Add_Dom">
Testing DD: <input type="checkbox" name="Product_Attributes[18]:value" value="Yes">
</div>

<input type="radio" name="rad" value="2" onClick="doClick(this);" />
Display NH Content

<div id="NH" style="display:none">

Testing NH:
<select name="Product_Attributes[7]:value">
<option value="NA" selected>Select an option...</option>
<option value="Lin_mn">Lin MN</option>
<option value="Lin_xz">Lin XZ</option>
</select>
</div>
thx,

SW

Kor
07-15-2007, 06:45 PM
The CSS display or the visibility changing does not affect the disabled HTML attribute. You have to change the HTML disabled attribute (which in DOM 0 has Boolean values) whenever you change the CSS display:


element.style.display='none';
element.disabled=true;
...
...
element.style.display='block';
element.disabled=false;



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum