Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Need help for retriving value from options

Status
Not open for further replies.
lipson

lipson

Technical User
Jul 23, 2010
2
US
Hi, I have an app, need to select "CHINA" for country and "Beijing" for city when web pahe loading, it works on Firefox and Chrome. failed to select City on IE 7/8, I need help to fix this problem.

Code as below:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body onload = preloadForm()>
<form name="studyleaveform" method=post >
<table>
<tr>
<td>Country<br />

<select name="v_country" id="v_country" size="5" onChange="updatev_city(this.selectedIndex)" style="width: 150px">
<option selected>Select A Country</option>
<option value="ARGENTINA">ARGENTINA</option>
<option value="AUSTRALIA">AUSTRALIA</option>
<option value="AUSTRIA">AUSTRIA</option>
<option value="BOLIVIA">BOLIVIA</option>
<option value="BOTSWANA">BOTSWANA</option>
<option value="BRAZIL">BRAZIL</option>
<option value="BRITISH WEST INDIES">BRITISH WEST INDIES</option>
<option value="CAMEROON">CAMEROON</option>
<option value="CHILE">CHILE</option>
<option value="CHINA">CHINA</option>
</select></td>

<td width=324>City<br />
<select name="v_program123" size="5" style="width: 150px" ></select></td>

<!--onChange="updatev_program(document.studyleaveform.v_country.selectedIndex,this.selectedIndex)"></select></td>
-->
<td width=326>Program<br />
<select name="v_institute" size="5" style="width: 350px"></select></td>
</tr>

<tr>
<td width="326">
<input type="hidden" maxlength=20 size=15 name=v_temp1 value="CHINA"/></td>

<td width="326">
<input type="hidden" maxlength=20 size=15 name=v_temp2 value="Beijing"/></td>

<td width="326">
<input type="hidden" maxlength=20 size=15 name=v_temp3 value="Pitzer College in China"/></td>
</tr>

</table>
</form>
</body>

<script type="text/javascript">

var v_programlist=document.studyleaveform.v_program123
var v_program=new Array()
v_program[0]=["I don''t know yet"]
v_program[1]=["Buenos Aires", "Mendoza"]
v_program[2]=["Melbourne", "Sydney", "Townsville"]
v_program[3]=["Vienna"]
v_program[4]=["Cochabamba"]
v_program[5]=["Gaborone"]
v_program[6]=["Rio de Janeiro","Fortaleza"]
v_program[7]=["South Caicos Island"]
v_program[8]=["Yaounde"]
v_program[9]=["Santiago", "Valparaiso"]
v_program[10]=["Shanghai","Hong Kong", "Kunming", "Beijing", "Harbin", "Hangzhou"]

function preloadForm()
{
var grabEl = document.getElementById("v_country");

for (var itemIndex = 0; itemIndex < grabEl.length; itemIndex++)
{
if (grabEl[itemIndex].value == document.studyleaveform.v_temp1.value)
{
grabEl[itemIndex].selected = true; preload_city_program(itemIndex); break
}
}
}

function preload_city_program(selectedcitygroup)
{

v_programlist.options.length=0

v_program_pointer=0
v_temp=0
v_index=0
v_cityvalue=0

for (i=0; i<v_program[selectedcitygroup].length; i++)
{
v_programlist.options[v_programlist.options.length]=new Option(v_program[selectedcitygroup])
}

for (i=0; i<document.studyleaveform.v_program123.length; i++)
{
v_cityvalue = document.studyleaveform.v_temp2.value
// v_index=document.studyleaveform.v_program123.selectedIndex

v_temp = document.studyleaveform.v_program123.options.value

if (v_temp == v_cityvalue)
{
v_programlist.options.selected = true
v_program_pointer=i

}
}

alert(document.studyleaveform.v_country.options[10].value);
}

function updatev_city(selectedcitygroup)
{
v_programlist.options.length=0

for (i=0; i<v_program[selectedcitygroup].length; i++)
v_programlist.options[v_programlist.options.length]=new Option(v_program[selectedcitygroup, v_program[selectedcitygroup]])
v_programlist.options[0].selected = true

}

</script>

</html>
 
Sort by date Sort by votes
The Option() constructor requires two parameters, you have passed only one in preload_city_program.
 
Upvote 0 Downvote
[1] As mentioned. But the reason is that, the constructor sets the text property but leaves the value property null. When you retrieve the .value of the option in question, as ie sees it, the .value remains null. For ff, when you retrieve .value and it finds nothing is set, it will take .text as a proxy for the value.

>v_programlist.options[v_programlist.options.length]=new Option(v_program[selectedcitygroup][i])
[tt]v_programlist.options[v_programlist.options.length]=new Option(v_program[selectedcitygroup][red],v_program[selectedcitygroup][/red])[/tt]

[2] And then this.

>v_programlist.options[v_programlist.options.length]=new Option(v_program[selectedcitygroup, v_program[selectedcitygroup][i]][i])
[tt]v_programlist.options[v_programlist.options.length]=new Option([red]v_program[selectedcitygroup][/red],[red] v_program[selectedcitygroup][/red])[/tt]
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
322
lexer
lexer
198709km
  • Locked
  • Question
Grouping XML key value using XSLT
Replies
0
Views
272
198709km
198709km
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
285
Rayj0000
Rayj0000
TheLazyPig
  • Locked
  • Question
Limit rows based on column value
Replies
0
Views
87
TheLazyPig
TheLazyPig
MDGarcia
  • Locked
  • Question
Connection to ORACLE from OutSystems
Replies
0
Views
75
MDGarcia
MDGarcia

Part and Inventory Search

Sponsor

Back
Top