469,616 Members | 1,620 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

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

IE not grabbing SELECT value

I have a page showing dynamic generation of a SELECT box using
JavaScript. See http://www.softouch.on.ca/dynamic.html.

Using Mozilla et al, choosing an option from both lists will result in
the correct response when 'Show Me' is clicked. But IE only shows the
result from the first SELECT box. Any ideas why / how to fix this?

The function I'm using:
function updateList(what)
{
// This dynamically populates the CurrentPositionPicks select box in
the resume page
// depending on what one was selected in the LevelOne select box.
for (var i=0;i<document.Resume.CurrentPositionPicks.length; i++) //
empty the list
{
document.Resume.CurrentPositionPicks.options.lengt h=0;
}

// LevelOnePicks is the top level select box in the resume form
// CurrentPositionPicks is the dynamically generated select list
var CurrentPositionPicks=document.Resume.CurrentPositi onPicks;
for (var i=0;i<document.Resume.LevelOnePicks.length;i++)
{
if (document.Resume.LevelOnePicks.options[i].selected)
{
var ThisList=eval(TopLevel[i].Name); // get the array name to use
for (var j=0; j < ThisList.length; j++)
{
CurrentPositionPicks.options[j]=new Option;
CurrentPositionPicks.options[j].text=ThisList[j];
}
}
}
}
Jul 23 '05 #1
6 5856
Amer Neely wrote:
I have a page showing dynamic generation of a SELECT box using
JavaScript. See http://www.softouch.on.ca/dynamic.html.

Using Mozilla et al, choosing an option from both lists will result in the correct response when 'Show Me' is clicked. But IE only shows the result from the first SELECT box. Any ideas why / how to fix this?

The function I'm using:
function updateList(what)
{
// This dynamically populates the CurrentPositionPicks select box in the resume page
// depending on what one was selected in the LevelOne select box.
for (var i=0;i<document.Resume.CurrentPositionPicks.length; i++) //
empty the list
{
document.Resume.CurrentPositionPicks.options.lengt h=0;
}

// LevelOnePicks is the top level select box in the resume form
// CurrentPositionPicks is the dynamically generated select list
var CurrentPositionPicks=document.Resume.CurrentPositi onPicks;
for (var i=0;i<document.Resume.LevelOnePicks.length;i++)
{
if (document.Resume.LevelOnePicks.options[i].selected)
{
var ThisList=eval(TopLevel[i].Name); // get the array name to use
for (var j=0; j < ThisList.length; j++)
{
CurrentPositionPicks.options[j]=new Option;
CurrentPositionPicks.options[j].text=ThisList[j];
}
}
}
}


The two browsers handle multiple selects differently. To get selected
option values/texts cross-browser, you need to loop the options and
examine them. In addition, your updateList() function isn't setting
option values, just displayed text. Some browsers will substitute the
latter for the former but, don't rely on it...set both.

function Output()
{
var o,
picked = [],
msel = document.Resume.CurrentPositionPicks;
for (var i = 0, l = msel.length; i < l; ++i)
{
if ((o = msel.options[i]).selected)
picked.push(o.text);
}
alert(
'You chose\n' +
document.Resume.LevelOnePicks.value +
':' +
picked.join(' | ')
);
}

Matt Kruse will now plug his script. #:=D

Jul 23 '05 #2
Amer Neely wrote:
I have a page showing dynamic generation of a SELECT box using
JavaScript. See http://www.softouch.on.ca/dynamic.html.

Using Mozilla et al, choosing an option from both lists will result in
the correct response when 'Show Me' is clicked. But IE only shows the
result from the first SELECT box. Any ideas why / how to fix this?

The function I'm using:


I would use a simpler technique:

<script type="text/javascript">
window["night spots"]=["Café Royale","Maxim's","Rose and Crown"];
cars=["ford","dodge","buick"];
countries=["USA","UK","East Timor"];

function populateMenuWithArray(menu,array){
var alen=array.length;
menu.options.length=0;
for(var i=0;i<alen;i++){
menu.options[i]=new Option(array[i],array[i]);
}
}

</script>

<form action="some.html" method="get" name="f">
<select name="a" onchange=
"if(this.selectedIndex)
populateMenuWithArray(this.form.b,
window[this[this.selectedIndex].text]);">
<option selected>Select One</option>
<option>cars</option>
<option>countries</option>
<option>night spots</option>
</select>
<select name="b"></select>
Mick (tested)

snip
Jul 23 '05 #3
Mick White wrote:
Amer Neely wrote:
I have a page showing dynamic generation of a SELECT box using
JavaScript. See http://www.softouch.on.ca/dynamic.html.

Using Mozilla et al, choosing an option from both lists will result in
the correct response when 'Show Me' is clicked. But IE only shows the
result from the first SELECT box. Any ideas why / how to fix this?

The function I'm using:

I would use a simpler technique:

<script type="text/javascript">
window["night spots"]=["Café Royale","Maxim's","Rose and Crown"];
cars=["ford","dodge","buick"];
countries=["USA","UK","East Timor"];

function populateMenuWithArray(menu,array){
var alen=array.length;
menu.options.length=0;
for(var i=0;i<alen;i++){
menu.options[i]=new Option(array[i],array[i]);
}
}

</script>

<form action="some.html" method="get" name="f">
<select name="a" onchange=
"if(this.selectedIndex)
populateMenuWithArray(this.form.b,
window[this[this.selectedIndex].text]);">
<option selected>Select One</option>
<option>cars</option>
<option>countries</option>
<option>night spots</option>
</select>
<select name="b"></select>
Mick (tested)

snip


Thanks for the quick response - I do like your simpler function. But IE
still only shows the second SELECT box choice.

I'm going to try the suggestion by RobB about looping through the list
boxes.
Jul 23 '05 #4
RobB wrote:
Amer Neely wrote:
I have a page showing dynamic generation of a SELECT box using
JavaScript. See http://www.softouch.on.ca/dynamic.html.

Using Mozilla et al, choosing an option from both lists will result


in
the correct response when 'Show Me' is clicked. But IE only shows the


result from the first SELECT box. Any ideas why / how to fix this?

The function I'm using:
function updateList(what)
{
// This dynamically populates the CurrentPositionPicks select box in


the resume page
// depending on what one was selected in the LevelOne select box.
for (var i=0;i<document.Resume.CurrentPositionPicks.length; i++) //
empty the list
{
document.Resume.CurrentPositionPicks.options.lengt h=0;
}

// LevelOnePicks is the top level select box in the resume form
// CurrentPositionPicks is the dynamically generated select list
var CurrentPositionPicks=document.Resume.CurrentPositi onPicks;
for (var i=0;i<document.Resume.LevelOnePicks.length;i++)
{
if (document.Resume.LevelOnePicks.options[i].selected)
{
var ThisList=eval(TopLevel[i].Name); // get the array name to use
for (var j=0; j < ThisList.length; j++)
{
CurrentPositionPicks.options[j]=new Option;
CurrentPositionPicks.options[j].text=ThisList[j];
}
}
}
}

The two browsers handle multiple selects differently. To get selected
option values/texts cross-browser, you need to loop the options and
examine them. In addition, your updateList() function isn't setting
option values, just displayed text. Some browsers will substitute the
latter for the former but, don't rely on it...set both.

function Output()
{
var o,
picked = [],
msel = document.Resume.CurrentPositionPicks;
for (var i = 0, l = msel.length; i < l; ++i)
{
if ((o = msel.options[i]).selected)
picked.push(o.text);
}
alert(
'You chose\n' +
document.Resume.LevelOnePicks.value +
':' +
picked.join(' | ')
);
}

Matt Kruse will now plug his script. #:=D


Ah, that figures. Thanks for the direction and the sample code.

Jul 23 '05 #5
RobB wrote:
Amer Neely wrote:
I have a page showing dynamic generation of a SELECT box using
JavaScript. See http://www.softouch.on.ca/dynamic.html.

Using Mozilla et al, choosing an option from both lists will result


in
the correct response when 'Show Me' is clicked. But IE only shows the


result from the first SELECT box. Any ideas why / how to fix this?

The function I'm using:
function updateList(what)
{
// This dynamically populates the CurrentPositionPicks select box in


the resume page
// depending on what one was selected in the LevelOne select box.
for (var i=0;i<document.Resume.CurrentPositionPicks.length; i++) //
empty the list
{
document.Resume.CurrentPositionPicks.options.lengt h=0;
}

// LevelOnePicks is the top level select box in the resume form
// CurrentPositionPicks is the dynamically generated select list
var CurrentPositionPicks=document.Resume.CurrentPositi onPicks;
for (var i=0;i<document.Resume.LevelOnePicks.length;i++)
{
if (document.Resume.LevelOnePicks.options[i].selected)
{
var ThisList=eval(TopLevel[i].Name); // get the array name to use
for (var j=0; j < ThisList.length; j++)
{
CurrentPositionPicks.options[j]=new Option;
CurrentPositionPicks.options[j].text=ThisList[j];
}
}
}
}

The two browsers handle multiple selects differently. To get selected
option values/texts cross-browser, you need to loop the options and
examine them. In addition, your updateList() function isn't setting
option values, just displayed text. Some browsers will substitute the
latter for the former but, don't rely on it...set both.

function Output()
{
var o,
picked = [],
msel = document.Resume.CurrentPositionPicks;
for (var i = 0, l = msel.length; i < l; ++i)
{
if ((o = msel.options[i]).selected)
picked.push(o.text);
}
alert(
'You chose\n' +
document.Resume.LevelOnePicks.value +
':' +
picked.join(' | ')
);
}

Matt Kruse will now plug his script. #:=D


This solution worked perfectly (but I changed the order of display).
Thanks again.
Jul 23 '05 #6
Amer Neely wrote:
Mick White wrote:


function populateMenuWithArray(menu,array){
var alen=array.length;
menu.options.length=0;
for(var i=0;i<alen;i++){
menu.options[i]=new Option(array[i],array[i]);
}
}

</script> snip

Thanks for the quick response - I do like your simpler function. But IE
still only shows the second SELECT box choice.

I'm going to try the suggestion by RobB about looping through the list
boxes.


Works for me, IE 5.2(Mac), FF 1.0(mac), Moz 1.7.3(Mac), Safari 1.03
Mick
Jul 23 '05 #7

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by InvisibleMan | last post: by
reply views Thread by T. | last post: by
2 posts views Thread by Darrel | last post: by
29 posts views Thread by Amer Neely | last post: by
reply views Thread by devrayhaan | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.