making another option box appear ??

[paul814]

Hello,
I am wondering if this is possible with JavaScript and how I would
accomplish something like this:

I have a page with a form on it with option list box on it with
options such as:
lstcirc, lstpress, lstmail, lstallbydate, lstall

What I would like to do is whenever lstallbydate is selected, right
then, another option group box would show up allowing the person to
enter a date.

Here is some of my code for the page now...:
<form id="form1" name="form1" method="post" action="select.php">
<p>
<label>
<input type="radio" name="radReadWrite" value="0"
id="radReadWrite_0" />
<span class="style5">Write Report</span></label>
<br />
<label>
<input type="radio" name="radReadWrite" value="1"
id="radReadWrite_1" />
<span class="style5">View Report</span></label>
</p>
<p><em><strong><span class="style5">Please also select the
department:</span></strong></em></p>
<p>
<select name="lstdepartment" id="lstdepartment">
<option value="lstEditorial">Editorial</option>
<option value="lstPrepress">Pre Press</option>
<option value="lstInformationTechnology">Information
Technology</option>
<option value="lstPres">Press</option>
<option value="lstMailroom">Mail Room</option>
<option value="lstCirculation">Circulation</option>
<option value="lstAll">All (View Only)</option>
<option value="lstAllbyDate">All (View by edition date)</
option>
</select>
</p>
<p>
<input type="submit" name="btnSubmit" id="btnSubmit"
value="Continue" />
<br />
</p>
</form>

Can this be done with JavaScripting? How would I do something like
this?

 

[Kailash Nadh]

Hello,
I am wondering if this is possible with JavaScript and how I would
accomplish something like this:

I have a page with a form on it with option list box on it with
options such as:
lstcirc, lstpress, lstmail, lstallbydate, lstall

What I would like to do is whenever lstallbydate is selected, right
then, another option group box would show up allowing the person to
enter a date.

Here is some of my code for the page now...:
<form id="form1" name="form1" method="post" action="select.php">
<p>
<label>
<input type="radio" name="radReadWrite" value="0"
id="radReadWrite_0" />
<span class="style5">Write Report</span></label>
<br />
<label>
<input type="radio" name="radReadWrite" value="1"
id="radReadWrite_1" />
<span class="style5">View Report</span></label>
</p>
<p><em><strong><span class="style5">Please also select the
department:</span></strong></em></p>
<p>
<select name="lstdepartment" id="lstdepartment">
<option value="lstEditorial">Editorial</option>
<option value="lstPrepress">Pre Press</option>
<option value="lstInformationTechnology">Information
Technology</option>
<option value="lstPres">Press</option>
<option value="lstMailroom">Mail Room</option>
<option value="lstCirculation">Circulation</option>
<option value="lstAll">All (View Only)</option>
<option value="lstAllbyDate">All (View by edition date)</
option>
</select>
</p>
<p>
<input type="submit" name="btnSubmit" id="btnSubmit"
value="Continue" />
<br />
</p>
</form>

Can this be done with JavaScripting? How would I do something like
this?

Change your <select.. > to:
<select name="lstdepartment" id="lstdepartment"
onchange="javascript:showDate(this);">


Insert this date textbox in the form, where ever you want it to
appear:
<input type="text" name="date" id="txtDate" style="display: none" />


Add finally, add the following after the </form> tag:
<script type="text/javascript">
<!--
function showDate(o) {
// if the select's current value is date, show the textbox
if(o.value == 'lstAllbyDate') {
document.getElementById('txtDate').style.display = 'block'; //
show
} else {
document.getElementById('txtDate').style.display = 'none'; //
hide
}
}
//-->
</script>


Hope that helps.