cdemott33
asked on
Reset a select box using Javascript
I trying to learn Javascript and could use a bit of help with a problem I'm having.
I have a link that, when clicked will past the name of the select box to a function that should reset the selectedIndex to zero, however it's not passing the name of the select box to the function.
Have a look at my code if you would.
The error I'm getting is: document.forms.0.box is null or not an object.
I want to pass the name of my select box, which in this case is "master2", to my function, but it's not being passed? Any help would be great.
I have a link that, when clicked will past the name of the select box to a function that should reset the selectedIndex to zero, however it's not passing the name of the select box to the function.
Have a look at my code if you would.
The error I'm getting is: document.forms.0.box is null or not an object.
I want to pass the name of my select box, which in this case is "master2", to my function, but it's not being passed? Any help would be great.
// My Javascript function
function resetLocationSelect( box ) {
document.forms[0].box.selectedIndex = 0;
}
// and here's my link in my HTML code.
<a href="javascript:void(0)" onclick="resetLocationSelect('master2');">Reset this select box</a></div>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Personally though I would recommend to use the "id='master2" attribute inside the <SELECT> and in the javascript I would use getElementById('master2') instead of getElementsByName('master2 ') because getElementById() will always send back only one element, but getElementsByName can send back more than 1 element if there is more <SELECT>s with the same name.
box is ur variable, not the id of the combo, you need to do this:
document.forms[0][box].sel ectedIndex = 0;
but you can have some poblems with that, if you want your combo to reset to no option is -1, 0 will pick up the first choice, -1 will leave it with nothing choosed.
I dont think ur problem is that the value is not being passed, to make sure you can write alert() in your function like this:
function resetLocationSelect( box ) {
alert(box);
document.forms[0].box.sele ctedIndex = 0;
}
that will alert you the value of the box variable when ur function is called.
also I recommend you to do something like this instead:
<script type="text/javascript">
function resetLocationSelect( boxId ) {
document.getElementById(bo xId).selec tedIndex = -1;
}
</script>
<select id="myCombo" ><option>a</option><option >b</option ></select>
<input type="button" value="Restart Combo" onclick="resetLocationSele ct( 'myCombo' ) "/>
document.forms[0][box].sel
but you can have some poblems with that, if you want your combo to reset to no option is -1, 0 will pick up the first choice, -1 will leave it with nothing choosed.
I dont think ur problem is that the value is not being passed, to make sure you can write alert() in your function like this:
function resetLocationSelect( box ) {
alert(box);
document.forms[0].box.sele
}
that will alert you the value of the box variable when ur function is called.
also I recommend you to do something like this instead:
<script type="text/javascript">
function resetLocationSelect( boxId ) {
document.getElementById(bo
}
</script>
<select id="myCombo" ><option>a</option><option
<input type="button" value="Restart Combo" onclick="resetLocationSele
// Try this JS Function
function resetLocationSelect( box ) {
var select = document.getElementsByName (box) == null ? document.forms[0][box] : document.getElementsByName (box);
if(select != null){
select.selectedIndex = 0;
}
}
function resetLocationSelect( box ) {
var select = document.getElementsByName
if(select != null){
select.selectedIndex = 0;
}
}
ASKER
Thank you. Worked perfectly.