HighDots Forums  

making another option box appear ??

Javascript JavaScript language (comp.lang.javascript)


Discuss making another option box appear ?? in the Javascript forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
paul814@excite.com
 
Posts: n/a

Default making another option box appear ?? - 11-28-2007 , 01:30 PM






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?

Reply With Quote
  #2  
Old   
Kailash Nadh
 
Posts: n/a

Default Re: making another option box appear ?? - 11-28-2007 , 07:10 PM






On Nov 28, 6:30 pm, paul... (AT) excite (DOT) com wrote:
Quote:
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.

--
Kailash Nadh | http://kailashnadh.name


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.