shwaqar82
asked on
how do i get selected item's index number in select box using client side javascript
Hi Experts
I need to capture the selected item's index number of select box using client side javascript.
im have the following form and select box gets populated using client side javascript:
<form name="frm" action="mygroup.aspx" method="post" onSubmit="return submitform();">
<table width="100%" border="0" cellspacing="1" cellpadding="1">
<tr><td>
<select name="gateway_dep" onchange="refreshDest()">
<option></option>
</select>
</td></tr>
<tr><td>
<select name="dest_dep" onchange="destchanged()">
<option></option>
</select>
</td></tr>
<tr><td>
<input name="submit" type="submit" value="Search">
</td></tr>
</table>
</form>
I need to get the value of selected item's index number on form submit. Any help plz.........?
regards
shaukat
I need to capture the selected item's index number of select box using client side javascript.
im have the following form and select box gets populated using client side javascript:
<form name="frm" action="mygroup.aspx" method="post" onSubmit="return submitform();">
<table width="100%" border="0" cellspacing="1" cellpadding="1">
<tr><td>
<select name="gateway_dep" onchange="refreshDest()">
<option></option>
</select>
</td></tr>
<tr><td>
<select name="dest_dep" onchange="destchanged()">
<option></option>
</select>
</td></tr>
<tr><td>
<input name="submit" type="submit" value="Search">
</td></tr>
</table>
</form>
I need to get the value of selected item's index number on form submit. Any help plz.........?
regards
shaukat
ASKER CERTIFIED SOLUTION
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.
Or maybe it's me who didn't understand this sentence correctly (?):
>I need to get the value of selected item's index number on form submit.
Yes, I guess dakyd understood it corectly, it's the value of the *number*.... Oh well ;)
Not for points but for better code
pass the form object and the select object in the event
Do NOT call anything name="submit" it is reserved
and do NOT try to submit the the form in the function you call onSubmit
<script>
function submitForm(theForm) {
if (theForm.gateway_dep.selec tedIndex<1 ) {
alert('Please select something');
theForm.gateway_dep.focus( )
return false; // cancel submit
}
return true; // submits the form
}
function refreshDest(theSel) {
alert(theSel.options[theSe l.selected Index].val ue);
}
</script>
<form action="mygroup.aspx" method="post" onSubmit="return submitform(this);">
<table width="100%" border="0" cellspacing="1" cellpadding="1">
<tr><td>
<select name="gateway_dep" onchange="refreshDest(this )">
<option></option>
</select>
</td></tr>
<tr><td>
<select name="dest_dep" onchange="destchanged(this )">
<option></option>
</select>
</td></tr>
<tr><td>
<input name="Submit" type="submit" value="Search">
</td></tr>
</table>
</form>
pass the form object and the select object in the event
Do NOT call anything name="submit" it is reserved
and do NOT try to submit the the form in the function you call onSubmit
<script>
function submitForm(theForm) {
if (theForm.gateway_dep.selec
alert('Please select something');
theForm.gateway_dep.focus(
return false; // cancel submit
}
return true; // submits the form
}
function refreshDest(theSel) {
alert(theSel.options[theSe
}
</script>
<form action="mygroup.aspx" method="post" onSubmit="return submitform(this);">
<table width="100%" border="0" cellspacing="1" cellpadding="1">
<tr><td>
<select name="gateway_dep" onchange="refreshDest(this
<option></option>
</select>
</td></tr>
<tr><td>
<select name="dest_dep" onchange="destchanged(this
<option></option>
</select>
</td></tr>
<tr><td>
<input name="Submit" type="submit" value="Search">
</td></tr>
</table>
</form>
ASKER
im using the following function and that works fine for me:
function submitform(theForm) {
alert(theForm.gateway_dep. options.se lectedInde x);
return true;
}
can you guys help me how to maintain the last selection in drop down on form submit. is that possible..plz help me
regards
shaukat
function submitform(theForm) {
alert(theForm.gateway_dep.
return true;
}
can you guys help me how to maintain the last selection in drop down on form submit. is that possible..plz help me
regards
shaukat
>> can you guys help me how to maintain the last selection in drop down on form submit
Sorry, not sure I understand what you want to do. Do you want to have the item that was selected on form submit still be selected after the form submission? Do you want to pass the selectedIndex from the last drop down to the server-side code?
Or, alternatively, can you explain what you're trying to do and what you need these values for? That might help us to provide suggestions.
Sorry, not sure I understand what you want to do. Do you want to have the item that was selected on form submit still be selected after the form submission? Do you want to pass the selectedIndex from the last drop down to the server-side code?
Or, alternatively, can you explain what you're trying to do and what you need these values for? That might help us to provide suggestions.
ASKER
>> Do you want to have the item that was selected on form submit still be selected after the form submission?
that what i need to implement
regards
shaukat
that what i need to implement
regards
shaukat
what is the user seeing when he submits - the result from the server or another page or stays on the same page (form is targetting a new window for example)
If the user sees the result plus a new form, you need to look through the options and add
selected
to the option that has the same value as the reponse.form("gateway_dep" )
If the user sees the result plus a new form, you need to look through the options and add
selected
to the option that has the same value as the reponse.form("gateway_dep"
ASKER
mplungjan
it stays in the same page after submitting the form...i need to have the selected item in the drop down to be selected after the form submission . the page submit to itself
regards
shaukat
it stays in the same page after submitting the form...i need to have the selected item in the drop down to be selected after the form submission . the page submit to itself
regards
shaukat
So it sends the form to the server and the server responds with a result plus itself?
It is quite simple to do on the server...
Just test the value as I mentioned using reponse.form("gateway_dep" )
It is quite simple to do on the server...
Just test the value as I mentioned using reponse.form("gateway_dep"
ASKER
yes i can get the value of reponse.form("gateway_dep" ) ...but how can i make the drop down control to select the value of reponse.form("gateway_dep" ) using javascript. all drop down control im using get populated dynamically using clien side javascript
well THAT was the missing information wasn't it?
either set a cookie or return the selected value in the page
<script>
var selVal = "<%=reponse.form("gateway_ dep") %>";
function setSel() {
if (selVal=="") return; // nothing passed
var sel = document.forms[0].gateway_ dep;
for (var i=0;i<sel.options.length;i ++) {
if (sel.options[i].value==sel val) {
sel.optins[i].selected=tru e;
break
}
}
}
window.onload=setSel;
or call setSel after populateion
either set a cookie or return the selected value in the page
<script>
var selVal = "<%=reponse.form("gateway_
function setSel() {
if (selVal=="") return; // nothing passed
var sel = document.forms[0].gateway_
for (var i=0;i<sel.options.length;i
if (sel.options[i].value==sel
sel.optins[i].selected=tru
break
}
}
}
window.onload=setSel;
or call setSel after populateion
Hmm...
shwaqar82, if it was mplungjan's answer that solved your problem (I suspect it was...), then please assign the points to him.
In any case a split would be nice
var theSel = document.frm.gateway_dep;
alert(theSel.options.selec
The same goes for any other drop-down. You can also combine the two statements into one if you like. Hope that helps.