469,640 Members | 1,561 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,640 developers. It's quick & easy.

javascript to determine which form element is displayed

Hello

Im trying to find the correct syntax to use to determine whether which form
element is visible on changing the value in a dropdown list
I need something in the onChange of the dropdown list that will cause the
appropriate element on another part of the page to be displayed

pseudo code below

var mydropdownlist =
document.questform.typeid.options[document.questform.typeid.selectedIndex].v
alue;
if(mydropdownlist<6)
then display <input name="ans1" type="text" >
else
display <textarea name="ans1" rows="1" ></textarea>

any help appreciated
ian

Nov 12 '06 #1
5 3835
mantrid wrote on 12 nov 2006 in comp.lang.javascript:
Hello

Im trying to find the correct syntax to use to determine whether which
form element is visible on changing the value in a dropdown list
I need something in the onChange of the dropdown list that will cause
the appropriate element on another part of the page to be displayed

pseudo code below

var mydropdownlist =
document.questform.typeid.options[document.questform.typeid.selectedInd
ex].v alue;
if(mydropdownlist<6)
then display <input name="ans1" type="text" >
else
display <textarea name="ans1" rows="1" ></textarea>

<script type='text/javascript'>
function change(x){
var mydropdownlist = x.options[x.selectedIndex].value;
var droparea = document.getElementById('droparea');

droparea.innerHTML = (mydropdownlist<6)
? '<input name="ans1" type="text">'
: '<textarea name="ans1" rows="1"></textarea>';
}
</script>

<form>
<select onclick='change(this)'>
<option value='1'1
<option value='2'2
<option value='8'8
</select>
<br><br><br><br><br><br><br><br>
<div id='droparea'></div>
</form>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Nov 12 '06 #2

"Evertjan." <ex**************@interxnl.netwrote in message
news:Xn********************@194.109.133.242...
mantrid wrote on 12 nov 2006 in comp.lang.javascript:
Hello

Im trying to find the correct syntax to use to determine whether which
form element is visible on changing the value in a dropdown list
I need something in the onChange of the dropdown list that will cause
the appropriate element on another part of the page to be displayed

pseudo code below

var mydropdownlist =
document.questform.typeid.options[document.questform.typeid.selectedInd
ex].v alue;
if(mydropdownlist<6)
then display <input name="ans1" type="text" >
else
display <textarea name="ans1" rows="1" ></textarea>


<script type='text/javascript'>
function change(x){
var mydropdownlist = x.options[x.selectedIndex].value;
var droparea = document.getElementById('droparea');

droparea.innerHTML = (mydropdownlist<6)
? '<input name="ans1" type="text">'
: '<textarea name="ans1" rows="1"></textarea>';
}
</script>

<form>
<select onclick='change(this)'>
<option value='1'1
<option value='2'2
<option value='8'8
</select>
<br><br><br><br><br><br><br><br>
<div id='droparea'></div>
</form>

thanks Evertjan
that look like what i need
Nov 13 '06 #3

"Evertjan." <ex**************@interxnl.netwrote in message
news:Xn********************@194.109.133.242...
mantrid wrote on 12 nov 2006 in comp.lang.javascript:
Hello

Im trying to find the correct syntax to use to determine whether which
form element is visible on changing the value in a dropdown list
I need something in the onChange of the dropdown list that will cause
the appropriate element on another part of the page to be displayed

pseudo code below

var mydropdownlist =
document.questform.typeid.options[document.questform.typeid.selectedInd
ex].v alue;
if(mydropdownlist<6)
then display <input name="ans1" type="text" >
else
display <textarea name="ans1" rows="1" ></textarea>


<script type='text/javascript'>
function change(x){
var mydropdownlist = x.options[x.selectedIndex].value;
var droparea = document.getElementById('droparea');

droparea.innerHTML = (mydropdownlist<6)
? '<input name="ans1" type="text">'
: '<textarea name="ans1" rows="1"></textarea>';
}
</script>

<form>
<select onclick='change(this)'>
<option value='1'1
<option value='2'2
<option value='8'8
</select>
<br><br><br><br><br><br><br><br>
<div id='droparea'></div>
</form>

--
Evertjan.
that work a treat. can i trouble you for an explanation of how the code is
working. ie what is each of the items below doing? particularly the
innerHTML = (mydropdownlist<6)
the '?'
and the ':'

is it the same as an if...else....? im trying to get my head around it.
droparea.innerHTML = (mydropdownlist<6)
? '<input name="ans1" type="text">'
: '<textarea name="ans1" rows="1"></textarea>';

sorry to be a nuisance. at the moment one of the elements will only display
on clicking the dropdown list. what would be the best approach to have one
as the default which is present when the page loads?

thanks again
ian
Nov 13 '06 #4
mantrid wrote on 13 nov 2006 in comp.lang.javascript:
Evertjan.
that work a treat. can i trouble you for an explanation of how the
code is working. ie what is each of the items below doing?
particularly the innerHTML = (mydropdownlist<6)
the '?'
and the ':'

is it the same as an if...else....? im trying to get my head around
it.
Yes, it is called a ternary operator.

It pays off to read the NG FAQ and the Jscript specs:

<http://www.jibbering.com/faq/>

<http://msdn.microsoft.com/library/en...7399ac32-9324-
4a9a-ae76-be9c0f9df81c.asp>

droparea.innerHTML = (mydropdownlist<6)
? '<input name="ans1" type="text">'
: '<textarea name="ans1" rows="1"></textarea>';

sorry to be a nuisance. at the moment one of the elements will only
display on clicking the dropdown list. what would be the best approach
to have one as the default which is present when the page loads?
==========================================
<script type='text/javascript'>
function change(x){
var mydropdownlist = x.options[x.selectedIndex].value;
var droparea = document.getElementById('droparea');

droparea.innerHTML = (mydropdownlist<6)
? '<input name="ans1" type="text">'
: '<textarea name="ans1" rows="1"></textarea>';
}
</script>

<form>
<select onclick='change(this)'>
<option value='1'1
<option value='2'2
<option value='8'8
</select>
<br><br><br><br><br><br><br><br>
<div id='droparea'>
<input name="ans1" type="text">
</div>
</form>
=============================================

Simple, isn't it??

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Nov 13 '06 #5
>
It pays off to read the NG FAQ and the Jscript specs:

<http://www.jibbering.com/faq/>

<http://msdn.microsoft.com/library/en...7399ac32-9324-
4a9a-ae76-be9c0f9df81c.asp>
thanks,will take a look at it. trouble with me is i havnt used javascript
much and i didnt really learn the proper way. i should have really looked at
the basics but i find myself just concentrating on finding solutions for
what i need at the moment. the wrong way around i know

==========================================
<script type='text/javascript'>
function change(x){
var mydropdownlist = x.options[x.selectedIndex].value;
var droparea = document.getElementById('droparea');

droparea.innerHTML = (mydropdownlist<6)
? '<input name="ans1" type="text">'
: '<textarea name="ans1" rows="1"></textarea>';
}
</script>

<form>
<select onclick='change(this)'>
<option value='1'1
<option value='2'2
<option value='8'8
</select>
<br><br><br><br><br><br><br><br>
<div id='droparea'>
<input name="ans1" type="text">
</div>
</form>
=============================================

Simple, isn't it??
it is. infact that occurd to me to, straight away. but i ruled it out almost
as quickly because i thought that
<div id='droparea'>
<input name="ans1" type="text">

would generate two elements when the dropdown list was clicked instead of
just the one. can understand why it doesnt

ian

Nov 13 '06 #6

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

19 posts views Thread by dmiller23462 | last post: by
14 posts views Thread by horos | last post: by
11 posts views Thread by Dag Sunde | last post: by
136 posts views Thread by Matt Kruse | last post: by
7 posts views Thread by amerar | last post: by
69 posts views Thread by Peter Olcott | last post: by
reply views Thread by gheharukoh7 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.