473,396 Members | 1,827 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,396 software developers and data experts.

onchange requires two reloads for child data?

M
i have a drop down menu of categories. for each category is
sub-catergories. based on the category i want the second drop-down menu to
list the subcategories to correspond with the parent category. well i have
it working fine, except the second drop-down wont display the corresponding
data unless the page is refreshed twice. how do i get it to load the first
time?

i just have a simple onChange="this.form.submit();" in the parent drop down

thanks!
Jul 23 '05 #1
2 1448
"M" <m@m.com> wrote in message news:6Z********************@comcast.com...
i have a drop down menu of categories. for each category is
sub-catergories. based on the category i want the second drop-down menu to list the subcategories to correspond with the parent category. well i have it working fine, except the second drop-down wont display the corresponding data unless the page is refreshed twice. how do i get it to load the first time?

i just have a simple onChange="this.form.submit();" in the parent drop down
thanks!

Will this help? Watch for word-wrap.

<html>
<head>
<title>category.htm</title>
<script type="text/javascript">
var cats = new Array();
cats[1] = "sub-category 1a,sub-category 1b,sub-category 1c";
cats[2] = "sub-category 2a,sub-category 2b,sub-category 2c";

function opts(that) {
document.form1.Subcategory.options.length = 0;
var catn = that.options[that.selectedIndex].value;
if (catn > 0) {
var catz = cats[catn].split(",");
for (var i=0; i<catz.length; i++) {
document.form1.Subcategory.options[i+1] = new Option(catz[i],
i+1);
}
}
}
</script>
</head>
<body>
<form name="form1">
&nbsp; <b>Category:</b> &nbsp;
<select name="Category" onchange="opts(this)">
<option value=""></option>
<option value="1">Category 1</option>
<option value="2">Category 2</option>
</select>
&nbsp; <b>Sub-Category:</b> &nbsp;
<select name="Subcategory" style="width:150px">
<option value=""></option>
</select>
</body>
</html>
Jul 23 '05 #2
McKirahan wrote:
"M" <m@m.com> wrote in message news:6Z********************@comcast.com...
i have a drop down menu of categories. for each category is
sub-catergories. based on the category i want the second drop-down menu
to
list the subcategories to correspond with the parent category. well i

[...]
Will this help? Watch for word-wrap. [...]

There are many reasons why your code won't help. It didn't work
at all in Firefox, I didn't test IE.

[...] var cats = new Array();
cats[1] = "sub-category 1a,sub-category 1b,sub-category 1c";
cats[2] = "sub-category 2a,sub-category 2b,sub-category 2c";
Why not declare cats[1] & [2] as arrays?

function opts(that) {
document.form1.Subcategory.options.length = 0;
length is a getter, not a setter. I guess the idea is to remove
the options currently in the select? If so, you need to remove
them manually.

Storing a reference to the select means fewer lookups and
simpler code:

var sel = document.form1.Subcategory;

Even better, pass a reference to the subcategory select when
calling the function.
var catn = that.options[that.selectedIndex].value;
if (catn > 0) {
Catn should also be less than the length of the cats array.

if (catn > 0 && catn < cats.length) {
var catz = cats[catn].split(",");
If you'd made cats arrays, you don't need this line.
for (var i=0; i<catz.length; i++) {
document.form1.Subcategory.options[i+1] = new Option(catz[i],
i+1);


Word wrap is bad, manually break lines to ensure it doesn't
happen. If arrays had been used, this becomes:

sel.options[i+1] = new Option(cats[catn],i);

[...]

There's quite a bit more to comment on, but I don't have the
time.

Try here:
<URL:http://www.ipwebdesign.net/kaelisSpace/useful_dynamicSelects.html>
--
Fred
Jul 23 '05 #3

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

Similar topics

2
by: F. Da Costa | last post by:
Hi, I'm trying to call/ mimic an onchange function/ event after a user has clicked a checkbox. In response to which a buncch of other ones need to be checked as well. The caveat is that each of...
13
by: Kai Grossjohann | last post by:
I have a web app which comprises different frames: a menu bar frame, a search form frame, a result list frame. Depending on the state, only a subset of these frames is available. (Eg, after...
13
by: dbuchanan | last post by:
Hello, Here is the error message; ---------------------------- Exception Message: ForeignKeyConstraint Lkp_tbl040Cmpt_lkp302SensorType requires the child key values (5) to exist in the...
1
by: richardscheff | last post by:
Video selector works for IE but not other browsers. for not IE <object ID='Player' data="video/dodgeball.wmv" type="video/x-ms-wmv" width="320" height="280"> <param name="filename"...
2
by: donald | last post by:
I have a function called populate which populate a select box. I need it to run when a different select box value is chnage. So I need the event onChange. But i need to pass it two var to. how...
2
by: shankwheat | last post by:
<select name="ddlProfiles" onchange="location.href=frmProfiles.ddlProfiles.options.value;addOption_list()"> Is it possible to call 2 different functions using the onChange event from a...
3
by: Amos0907 | last post by:
Dear All, I am a learner of Javascript. I got an assignment as below. Could anyone give me a suggestion for fixing the function of "onChangeColumn4()". The original requirement of the start date of...
9
by: mel | last post by:
Hi all, I need a persistent TCP connection with my web server over page reloads. This means that, even if the user goes to a different page (in my domain), I want to keep a TCP connection...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
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,...
0
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...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

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.