Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 188
  • Last Modified:

Select box length property returns count of option tags instead

I need to find out how many select boxes I have on a page, as the user can push a button and add a row with a new select box.  They all have the same name.  The .length property works if there's more than one, but how do I know that? If there's only one, it returns the number of options in the select box. ARRGH!! Why can't it be consistant?

Thanks in advance,
Mike
0
mbrengartner
Asked:
mbrengartner
1 Solution
 
DeAnCommented:
<html>
<head>
<title></title>

<script language="JavaScript">
<!--
function countlists() {
  var f = document.frm;
  var cnt = 0;
  for (var i=0;i<f.elements.length;i++) {
    var e = f.elements[i];
     if(e.type=="select-one") { cnt++;}
  }
  alert(frm.lst.length);
  alert(cnt);
}
onload=countlists;
//-->
</script>

</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#9900CC" alink="#FF0000">

<form name="frm">


<select name="lst">
<option>op1</option>
<option>op2</option>
<option>op3</option>
<option>op4</option>
</select>

</form>

</body>
</html>
0
 
mbrengartnerAuthor Commented:
So you're saying the only way to do this is I have to loop through the ENTIRE document elements and do a manual count?  Plus, the above code gives me all select boxes, not just the ones with the same name.

Why is this one so much different from all the other elements where I can just use the .length property? If there's more than one select box, it works just fine. Normally I would just check (.length == undefined), but the length is always defined.

It just means two different things.

Thanks,
Mike
0
 
mbrengartnerAuthor Commented:
So you're saying the only way to do this is I have to loop through the ENTIRE document elements and do a manual count?  Plus, the above code gives me all select boxes, not just the ones with the same name.

Why is this one so much different from all the other elements where I can just use the .length property? If there's more than one select box, it works just fine. Normally I would just check (.length == undefined), but the length is always defined.

It just means two different things.

Thanks,
Mike
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
mbrengartnerAuthor Commented:
So you're saying the only way to do this is I have to loop through the ENTIRE document elements and do a manual count?  Plus, the above code gives me all select boxes, not just the ones with the same name.

Why is this one so much different from all the other elements where I can just use the .length property? If there's more than one select box, it works just fine. Normally I would just check (.length == undefined), but the length is always defined.

It just means two different things.

Thanks,
Mike
0
 
DeAnCommented:
I can't find a good way around this without looping through them all.  they should have made it so if you want the options array, then ask for it.. document.frm.lst.options.length  ..oh well. lame

looping shouldn't be a big prob unless you have a really lot of elements on the form.

If you don't want to loop, you could add a hidden input with the same name so it is index 0 of the array and adjust the count by subtracting 1.  Not sure if this is good to mix element types in an element array, tho.

<html>
<head>
<title></title>

<script language="javascript">
<!--
function countlists() {
  var f = document.frm;
  if(!f.lst[1]) alert("0");
  else alert(f.lst.length-1);
}
onload=countlists;
//-->
</script>

</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#9900CC" alink="#FF0000">

<form name="frm">

<input type="hidden" name="lst">

<select name="lst">
<option>op1</option>
<option>op2</option>
<option>op3</option>
<option>op4</option>
</select>

</form>

</body>
</html>

hope it helps
0
 
mbrengartnerAuthor Commented:
Thanks, but I figured it out.  

The "getElementsByName" method evidently does that loop for me and returns me a collection of elements that match the ID or NAME.  I don't know why I didn't think of that before.

var obj = document.getElementsByName("select1");
for (var i = 0; i < obj.length; i++)
{
    alert(obj[i].value);
}

Thanks for your help,
Mike
0
 
jaysolomonCommented:
No comment has been added lately, so it's time to clean up this TA.
I will leave the following recommendation for this question in the Cleanup topic area:

PAQ with points refunded

Please leave any comments here within the next seven days.
PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!

jAy
EE Cleanup Volunteer
0
 
SpazMODicCommented:
PAQed, with points refunded (75)

SpazMODic
EE Moderator
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now