473,545 Members | 2,196 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Dumb question about using a <SELECT> menu to change the state of<SELECT> menu...

This has got to be obvious, but I can't make it work.

I have a form called with 3 pull down menus. They are linked to a database
which generates the values for the <SELECT? Pull-downs.

Lets say I have values selected for all three pull down menus.

When I change the first "top-level" menu I want to reset both the second and
third menus to the "default" state.

I thought this would be easy with some javascript on the pull down in
question like:

<select name="category" onchange="docum ent.forms.form_ field.options[0];">

So when I change category I reset my sub-categories and sub-sub-categories
back to NULL to avoid duff queries being made.

I've tried any number of iterations, but it still won't work.

Please put me out of my misery?

TIA.
Jul 23 '05 #1
6 2388
Bonge Boo! wrote:
This has got to be obvious, but I can't make it work.
I have a form called with 3 pull down menus. They are linked to a database
which generates the values for the <SELECT? Pull-downs.
Lets say I have values selected for all three pull down menus.
When I change the first "top-level" menu I want to reset both the second and
third menus to the "default" state.
I thought this would be easy with some javascript on the pull down in
question like:
<select name="category" onchange="docum ent.forms.form_ field.options[0];">
So when I change category I reset my sub-categories and sub-sub-categories
back to NULL to avoid duff queries being made.
I've tried any number of iterations, but it still won't work.
Please put me out of my misery?
TIA.


Post the relevant code.
Jul 23 '05 #2
Bonge Boo! wrote:
This has got to be obvious, but I can't make it work.

I have a form called with 3 pull down menus. They are linked to a database
which generates the values for the <SELECT? Pull-downs.

Lets say I have values selected for all three pull down menus.

When I change the first "top-level" menu I want to reset both the second and
third menus to the "default" state.

I thought this would be easy with some javascript on the pull down in
question like:

<select name="category" onchange="docum ent.forms.form_ field.options[0];">

So when I change category I reset my sub-categories and sub-sub-categories
back to NULL to avoid duff queries being made.


You need to set the selectedIndex to zero:

<select ... onchange="this. form.form_field .selectedIndex = 0;">

or something like that, play code below.
<form action="">
<select name="set1" onchange="
this.form.set2. selectedIndex = 0;
this.form.set3. selectedIndex = 0;
">
<option>Set 1 Opt 0</option>
<option>Set 1 Opt 1</option>
<option>Set 1 Opt 2</option>
</select>

<select name="set2">
<option>Set 2 Opt 0</option>
<option>Set 2 Opt 1</option>
<option>Set 2 Opt 2</option>
</select>
<select name="set3">
<option>Set 3 Opt 0</option>
<option>Set 3 Opt 1</option>
<option>Set 3 Opt 2</option>
</select>
</form>
You may wish to write a function that does the job for you by running
through the other options rather than putting all the code in the
element tag.

Then the above selecte set1 could change to:

<select name="set1" onchange="
resetSel(this.f orm,'set2','set 3');
">

if a function is added like this:

<script type="text/javascript">
function resetSel(){
var i = arguments.lengt h;
while ( --i ){
arguments[0].elements(argum ents[i]).selectedIndex = 0;
}
}
</script>

--
Rob
Jul 23 '05 #3
On 23/4/05 2:38 am, in article
42************* ********@per-qv1-newsreader-01.iinet.net.au , "RobG"
<rg***@iinet.ne t.auau> wrote:
I thought this would be easy with some javascript on the pull down in
question like:

<select name="category" onchange="docum ent.forms.form_ field.options[0];">

So when I change category I reset my sub-categories and sub-sub-categories
back to NULL to avoid duff queries being made.
You need to set the selectedIndex to zero:

<select ... onchange="this. form.form_field .selectedIndex = 0;">


Thank you VERY much. I'm sure I'd tried that at some point but couldn't get
it working. So I started thrashing around elsewhere...
You may wish to write a function that does the job for you by running
through the other options rather than putting all the code in the
element tag.

Then the above selecte set1 could change to:

<select name="set1" onchange="
resetSel(this.f orm,'set2','set 3');
">

if a function is added like this:

<script type="text/javascript">
function resetSel(){
var i = arguments.lengt h;
while ( --i ){
arguments[0].elements(argum ents[i]).selectedIndex = 0;
}
}
</script>


Nice. Just because I'm stupid, arguments.lengt h give us the number of
arguments I place into my function, and --i loops for the -1 number of
arguments I put in?

Bit of newbie to programming. I know PHP passing well, but find it difficult
trnslating that knowledge in anything but the most general way to other
languages like Javascript and Actionscript.

Last question. Do you have a suggestion for a "slightly above moron's level"
book on Javascript?

Jul 23 '05 #4
Bonge Boo! wrote:
This has got to be obvious, but I can't make it work.

I have a form called with 3 pull down menus. They are linked to a database which generates the values for the <SELECT? Pull-downs.

Lets say I have values selected for all three pull down menus.

When I change the first "top-level" menu I want to reset both the second and third menus to the "default" state.

I thought this would be easy with some javascript on the pull down in
question like:

<select name="category" onchange="docum ent.forms.form_ field.options[0];">
So when I change category I reset my sub-categories and sub-sub-categories back to NULL to avoid duff queries being made.

I've tried any number of iterations, but it still won't work.

Please put me out of my misery?

TIA.


Are these 'cascading selects' (each choice gets more specific)? If so,
the application itself should reset the dependent listboxes as needed.

Just for the record:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript">

function ddreset()
{
if (document.getEl ementById)
{
var sel, o, j, l = arguments.lengt h;
for (var i = 0; i < l; ++i)
{
if (sel = document.getEle mentById(argume nts[i]))
{
j = 0;
while (o = sel.options[j++])
if (o.defaultSelec ted)
o.selected = true;
}
}
}
}

</script>
</head>
<body>
<form>
<select id="toplevel" name="toplevel"
onchange="ddres et('second','th ird')">
<option value="1">optio n 1</option>
<option value="2">optio n 2</option>
<option value="3">optio n 3</option>
<option value="4">optio n 4</option>
<option value="5">optio n 5</option>
</select>
<select id="second" name="second">
<option value="a">an option</option>
<option value="b">an option</option>
<option value="c">an option</option>
<option value="d">an option</option>
<option value="e" selected="selec ted">default option</option>
</select>
<select id="third" name="third">
<option value="aa">an option</option>
<option value="bb" selected="selec ted">default option</option>
<option value="cc">an option</option>
<option value="dd">an option</option>
<option value="ee">an option</option>
</select>
</form>
</body>
</html>

Jul 23 '05 #5
Bonge Boo! wrote:
On 23/4/05 2:38 am, in article
42************* ********@per-qv1-newsreader-01.iinet.net.au , "RobG"
<rg***@iinet.ne t.auau> wrote:

I thought this would be easy with some javascript on the pull down in
question like:

<select name="category" onchange="docum ent.forms.form_ field.options[0];">

So when I change category I reset my sub-categories and sub-sub-categories
back to NULL to avoid duff queries being made.
You need to set the selectedIndex to zero:

<select ... onchange="this. form.form_field .selectedIndex = 0;">

Thank you VERY much. I'm sure I'd tried that at some point but couldn't get
it working. So I started thrashing around elsewhere...

You may wish to write a function that does the job for you by running
through the other options rather than putting all the code in the
element tag.

Then the above selecte set1 could change to:

<select name="set1" onchange="
resetSel(this.f orm,'set2','set 3');
">

if a function is added like this:

<script type="text/javascript">
function resetSel(){
var i = arguments.lengt h;
while ( --i ){
arguments[0].elements(argum ents[i]).selectedIndex = 0;
}
}
</script>

Nice. Just because I'm stupid, arguments.lengt h give us the number of
arguments I place into my function, and --i loops for the -1 number of
arguments I put in?


Yes. Using --i decrements i before it is evaluated by the 'while' so
when it gets to arguments[0] statements in the body are not executed.

If you want to execute the body when i=0 (which is the usual case)
use i-- so that i is decremented *after* being evaluated.

Bit of newbie to programming. I know PHP passing well, but find it difficult
trnslating that knowledge in anything but the most general way to other
languages like Javascript and Actionscript.

Last question. Do you have a suggestion for a "slightly above moron's level"
book on Javascript?


I can't recommend any other than to say the O'Reilly stuff is
usually pretty good. W3Schools have a reasonable set of online
starter tutorials, they also have some useful stuff on HTML, CSS and
other web technologies too.

<URL:http://www.w3schools.c om/>

--
Rob
Jul 23 '05 #6
On 24/4/05 7:34 am, in article
42************* **********@per-qv1-newsreader-01.iinet.net.au , "RobG"
<rg***@iinet.ne t.auau> wrote:

Many thanks. Further your previous question, the contents of the 3 pop-up
menus are genereated by a PHP query to MYSQL.

So all I needed to do was reset the value of the "lower" down menus, along
with a this.form.submi t() and presto verything works out nicely.

Ta very much.
Nice. Just because I'm stupid, arguments.lengt h give us the number of
arguments I place into my function, and --i loops for the -1 number of
arguments I put in?


Yes. Using --i decrements i before it is evaluated by the 'while' so
when it gets to arguments[0] statements in the body are not executed.

If you want to execute the body when i=0 (which is the usual case)
use i-- so that i is decremented *after* being evaluated.


Ah! Didn't know the side made a difference. Very handy.
Bit of newbie to programming. I know PHP passing well, but find it difficult
trnslating that knowledge in anything but the most general way to other
languages like Javascript and Actionscript.

Last question. Do you have a suggestion for a "slightly above moron's level"
book on Javascript?


I can't recommend any other than to say the O'Reilly stuff is
usually pretty good. W3Schools have a reasonable set of online
starter tutorials, they also have some useful stuff on HTML, CSS and
other web technologies too.

<URL:http://www.w3schools.c om/>


Thank you.

Jul 23 '05 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
17495
by: Laphan | last post by:
Hi All Could you please confirm what the syntax is to change the style of a <SELECT> box using CSS. I basically want to take the 3D effect off this box, but it doesn't seem to be possible like it is with an <INPUT> box. Thanks
3
14246
by: frodo | last post by:
Hi, I'm new here ( Hi all ), and my problem is: Is possible to change layout of drop-down list made with <select> & <option> tags. I don't like this ugly gray arrow, slider etc. in normal dropdown element. I tried the same way like for eq. <input> but in case of <select> it dosen't work.
3
15086
by: Chamomile | last post by:
I've only just come accross this newsgroup, so apologies if I seem to be cross-posting... this may be an old chestnut, but has anyone ever come accross a straightforward way of styling a <select> element? In particular the (always grey?) drop-down button color. (This, and the 'Browse' button on an <input type='file'> seems forever doomed...
3
16406
by: gekoblu | last post by:
Hi!, I want to fix via javascript the combo width to a fix value. I'd like to implement a kind of ALT / TITLE function to show the entire option when the text is longer than the combo width... It's possible?!? Thanks
2
1648
by: Astra | last post by:
Hi All Wondered if you could help me with the below query. I have 1 simple table called STOCKCATS that consists of 2 fields. These fields are called CATID and LEVEL. The contents of this table are as follows:
3
14309
by: i_dvlp | last post by:
I'm trying to replicate a fancy drop-down control (MS-egads!) with form <select><option> It doesn't look like you can specity width as an attribute or define width with CSS. It looks like my choices are to use smaller fonts or choose shorter option strings. inline: I want to put a small graphic immediately to the right of the select.
4
39322
by: Man-wai Chang | last post by:
-- iTech Consulting Co., Ltd. Expert of ePOS solutions Website: http://www.itech.com.hk (IE only) Tel: (852)2325 3883 Fax: (852)2325 8288
1
2385
by: mcapacci | last post by:
I would like to force the flow of the scrolling of the options listed in a drop down menu, <select>, from top to bottom without allowing bottom up scroll to appear; furthermore I need also to control the number of options visible in the default scroll region in the <select> to a fixed number of items or a fixed region in px. Anybody can help...
1
5560
by: akoymakoy | last post by:
Good Day I have these line of codes in my javascript ...... if (selObj.type == 'text' ) { parentObj = document.getElementById('destinationCity').parentNode; parentObj.removeChild(selObj); var inputSel = document.createElement("SELECT"); inputSel.setAttribute("name","destinationCity"); ...
0
7465
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
7656
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. ...
0
7805
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
1
7416
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
0
4944
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert...
0
3449
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
0
3441
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
1013
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
701
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.