www.webdeveloper.com
Results 1 to 7 of 7

Thread: Joining arrays

  1. #1
    Join Date
    May 2009
    Posts
    46

    Joining arrays

    Can anyone tell me why this doesn't work?

    Code:
            var obj = document.getElementById('form_id');
    	var myArray = new Array();
    	var _input = obj.getElementsByTagName('input');
    	var _select = obj.getElementsByTagName('select');
    
            myArray = _input.concat(_select);
    I'm trying to get an array that contains all the input & select tags. When I run this, myArray contains the input tags, but not the select tags.

    Any suggestions would be greatly appreciated.
    Brian

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,377
    Only a guess.

    It maybe that what is being returned is not an array, but is instead a list of object or element references.

    Try putting an alert after collecting the information to see what you have got!
    ie:
    alert(_input.join('\n'));
    alert(_select.join('\n'));

  3. #3
    Join Date
    May 2009
    Posts
    46
    Thanks for the quick reply!

    I tried putting an alert like you suggested, and I'm getting an error that _input.join is not a function. Which tells me that _input is not an array. But when I do "alert(_input.length)" I get an alert that says "2". So is a list of objects not an array? I didn't realize that a list is different that an array. Is there a way to join two lists together?

    Thanks again!
    Brian

  4. #4
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,377

    Question

    How about trying:

    Code:
    var myArray = new Array();
    for (i in _input) { myArray[myArray.length] = i; }
    for (i in _select) { myArray[myArray.length] = i; }
    alert(myArray.join('\n'));
    What happens then?

  5. #5
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,377

    Arrow

    I tried this as a test ... Seems to work without any errors
    and it displays something ... I just have no idea what it means.

    Code:
    <html>
    <head>
    <title>Concatonate Tags into Array</title>
    <script type="text/javascript">
    function DisplayTags() {
      var obj = document.getElementById('form_id');
      var _input = obj.getElementsByTagName('input');
      var _select = obj.getElementsByTagName('select');
    
      var myArray = new Array();
      for (i in _input) { myArray[myArray.length] = i; }
      for (i in _select) { myArray[myArray.length] = i; }
      alert(myArray.join('\n'));
    }
    </script>
    </head>
    <body>
    <form id="form_id" name="form_id" onsubmit="return false">
     <table border="1"><tr><td>
     <input type="input" name="inA1" value="A"> A<br>
     <input type="input" name="inB1" value="B"> B<br>
     <input type="input" name="inC1" value="C"> C<br>
    </td><td> 
     <select id="SBox1" name="SBox1">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
     </select>
    </td><td> 
     <select id="SBox2" name="SBox2">
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
     </select>
    </td><td>
     <input type="input" name="inA2" value="A"> A<br>
     <input type="input" name="inB2" value="B"> B<br>
     <input type="input" name="inC2" value="C"> C<br>
    </td></tr></table>
     
     <button onclick="DisplayTags()">Display Tag Array</button>
    </form>
    </body>
    </html>

  6. #6
    Join Date
    May 2009
    Posts
    46
    LOL.. I tried your code, and I can't figure out what it's outputting either.

    I tried substituting "alert(myArray[i].name)" for "alert(myArray.join)". I got undefined for each item. The other weird thing is that if I do "alert(myArray.length)" it says there are 14 items in the array, but there should be 8....

    So using your code, I modified the function to this, and it seems to work:

    Code:
    function DisplayTags() {
      var obj = document.getElementById('form_id');
      var _input = obj.getElementsByTagName('input');
      var _select = obj.getElementsByTagName('select');
      var myArray = new Array();
    
    	for(var i=0; i<_input.length; i++){ myArray[myArray.length] = _input[i];}
    	for(i=0; i<_select.length; i++){ myArray[myArray.length] = _select[i]; }
    	
    	for(i=0; i<myArray.length; i++){
    		alert("name: "+myArray[i].name+"\nitem "+(i+1)+" of "+myArray.length);	
    	}
    }
    It's the same basic idea, but for some reason, when addressing the array with the index value, it seems to work.

    Thanks for your help. I was hoping for a cleaner solution, like using a method of the Array object, but I can't seem to figure it out.

    Thanks again!
    Brian

  7. #7
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,377

    Thumbs up

    You're most welcome.
    I guess we'll need the help of some more experienced forum members to explain what's happening ,
    but so long as it works for you, I'm happy ...

    Good Luck!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles