I have a script to check and prompt for input boxes that arent filled out that are specified in the script. I also have a drop down with a few options. One of the options, when selected shows the "hidden" text box. The script works very well except when the "hidden" text box is not activated by selecting that specific option, the script still prompts to enter text in the box, even though its hidden. My javascript skills are little to none, can someone help me out with this? I just need it to "not" prompt unless the box is shown. Thanks, I can post my code if needed upon request. Thanks,

Would need to see your validation script. Are you checking for visibility of the textbox before making it mandatory? Look for something along those lines if you don't have a chance to post your code.

Jafuller --- my code is below...any help would be greatly appreciated.

Scripts:

<script type="text/javascript">
function ToogleTextbox(pValue) {
var textBox = document.getElementById('FlyerNumber');
if(pValue) {
textBox.style.display = "block";
}
else {
textBox.style.display = "none";
}
}
</script>
<!---end display txt box on selection--->
<script type="text/javascript">
function ValidateContactForm()
{
var FirstName = document.form1.FirstName;
var LastName = document.form1.LastName;
var DaytimePhone = document.form1.DaytimePhone;
var Email = document.form1.Email;
var FlyerNumber = document.form1.FlyerNumber;
if (FirstName.value == "")
{
window.alert("Please enter your first name.");
FirstName.focus();
return false;
}
if (LastName.value == "")
{
window.alert("Please enter your last name.");
LastName.focus();
return false;
}
if (DaytimePhone.value == "")
{
window.alert("Please enter your daytime phone number.");
DaytimePhone.focus();
return false;
}
if (Email.value == "")
{
window.alert("Please enter your email address.");
Email.focus();
return false;
}
if (FlyerNumber.value == "")
window.alert("Please enter a flyer number.");
FlyerNumber.focus() ;
return false;
}
</script>


Form:

<form name="form1" id="form1" action="<?php echo $editFormAction; ?>" method="post" onSubmit="return ValidateContactForm();"/>
<tr>
<td width="99">First Name</td>
<td width="192"><input name="FirstName" type="text" id="FirstName" width="100%"/></td>
<td width="8">&nbsp;</td>
<td width="163" align="center">&nbsp;</td>
</tr>
<tr>
<td >Last Name </td>
<td><input name="LastName" type="text" id="LastName" width="100%"/></td>
<td>&nbsp;</td>
<td align="center">&nbsp;</td>
</tr>
<tr>
<td >Daytime Phone</td>
<td><input name="DaytimePhone" type="text" id="DaytimePhone" width="100%"/></td>
<td>&nbsp;</td>
<td align="center"> </td>
</tr>
<tr>
<td>Evening Phone</td>
<td><input name="EveningPhone" type="text" id="EveningPhone" width="100%"/></td>
<td align="center"></td>
<td align="center"></td>
</tr>
<tr>
<td >Home Address</td>
<td><input name="Address" type="text" id="Address" width="100%"/></td>
<td>&nbsp;</td>
<td align="center"></td>
</tr>
<tr>
<td>County</td>
<td><input name="County" type="text" id="County" width="100%"/></td>
<td></td>
<td align="center"></td>
</tr>
<tr>
<td >City</td>
<td><input name="City" type="text" id="City" width="100%"/></td>
<td>&nbsp;</td>
<td align="center">&nbsp;</td>
</tr>
<tr>
<td >State</td>
<td><input name="State" type="text" id="State" width="100%"/></td>
<td>&nbsp;</td>
<td align="center">&nbsp;</td>
</tr>
<tr>
<td >Zip Code</td>
<td><input name="Zip" type="text" id="Zip" width="100%"/></td>
<td>&nbsp;</td>
<td align="center">&nbsp;</td>
</tr>
<tr>
<td>Email</td>
<td><input name="Email" type="text" id="Email" width="100%"/></td>
<td>&nbsp;</td>
<td align="center">&nbsp;</td>
</tr>
<tr>
<td >Product Interest</td>
<td>
<select name="Service" id="Service" onchange="javascript: ToogleTextbox(this.value == 'null');">
<option >Please Select a Service</option>
<option></option>
<option>HUD 203k Friendly</option>
<option>Replacement Windows</option>
<option>Siding</option>
<option>Roofing</option>
<option>Room Additions</option>
<option>Sunrooms</option>
<option>Basement Refinishing</option>
<option>Garages</option>
<option>Decks</option>
<option>Patios</option>
<option>Walkways</option>
<option>Gazebos</option>
<option>Screen Porches</option>
<option>Fencing</option>
</select></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<tr>
<td>Referred By</td>
<td>
<select name="ReferredBy" id="ReferredBy" onchange="javascript: ToogleTextbox(this.value == 'null');">
<option>Internet Search</option>
<option>Telephone Book</option>
<option>Any Options</option>
<option id="PromotionalFlyer" value="null">Promotional Flyer</option>
</select>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
****This is the text box that I only want to be checked for values IF the option ID of "PromotionalFlyer" is selected*******
<td><input name="FlyerNumber" type="text" id="FlyerNumber" style="display: none;" width="100%"/></td>
<td>&nbsp;</td>
</tr>
<td align="center"></td>
</tr>
</table>
<table width="463" height="59" border="0" align="center">
<tr>
<td align="center" >
<span ><br/>Please tell us more.<br/><br/>
<textarea name="Comments" rows="4"cols="70%%"id="Comments" style="overflow"></textarea>
</span>
<p>
<input type="hidden" name="MM_insert" value="form1" />
</p>
</td>
</tr>
<tr>
<td align="center"><input type="submit" name="Submit" value="Submit" /></td></form>

any ideas??

i have a simple code to solve that:

<form action="">
<select onchange="if (this.selectedIndex==2){this.form['box'].style.visibility='visible'}else {this.form['box'].style.visibility='hidden'};">
<option value="">0</option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
</select>
<input style="visibility:hidden;" type="text" name="box">
</form>

copy paste this code to see how it's works, and then use it to solve the problem.
good luck

Hey thanks a lot. I'll give it a try and let you know how it works.

ok, I tried your script however, when the text box is visible, it doesnt prompt if there are no values in the box....

I tried it also on local server and could not locate the issue

well, I got the script to work, everything is verifying that the required fields are filled out, but I still cant get it to only verify ONLY if the hidden text box is visible to the user.

try this code:

<html>
<script language="javascript">
function validasi()
{
    var nama=form1.box.value;

    if(nama == "")
    {
        alert("check your field");
        form1.box.focus();
    }
    else
        alert("success")
}


function btnSubmit()
{
    validasi();
}

</script>
<body>
<form name="form1">
<select onchange="if (this.selectedIndex==2){this.form['box'].style.visibility='visible'}else {this.form['box'].style.visibility='hidden'};">
<option value="">0</option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
</select>

<input style="visibility:hidden;" type="text" name="box"></input>
<input type="button" value="Submit" name="submit" onClick="btnSubmit()"></input>                    
</form>
</body>

</html>

good luck

Davelf -- I'm not sure if you understand exactly what I am trying to do, the second code you posted does the same thing that I already have. I can already verify and prompt if there is nothing in the required fields. What I need is to ONLY check that text field IF it is visible. Follow me?