#1
  1. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,622
    Rep Power
    595

    Checkbox Array with Explicit Indicies


    I have an array of checkboxes that I need to access via javascript. Generally I can access them like this:
    Code:
    function sendall(form) {
    	with (document.main)
    	alert(send.length);
    }
    When the alert is executed I get an error saying 'send' is not defined. All the examples of creating checkbox arrays do not use explicit indices (these are in a form named 'main').
    Code:
    <input type="checkbox" name="send" />
    <input type="checkbox" name="send" />
    <input type="checkbox" name="send" />
    However, I need the checkboxes to properly correspond to other items when processed by PHP. Therefore I am required to explicitly define the indices (this is actually done by PHP in a loop):
    Code:
    <input type="checkbox" name="send[0]" />
    <input type="checkbox" name="send[1]" />
    <input type="checkbox" name="send[2]" />
    I am guessing that is the reason Javascript thinks the array is undefined (yet $_POST in PHP has it as an array). If my guess is wrong, why am I getting an undefined error? Is there a different HTML syntax for specifying the name with an index? If I am right, how do I get Javascript to recognize the checkboxes as an array? TIA.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  2. #2
  3. Jealous Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    14,303
    Rep Power
    9400
    There's some weird contradictions in your post but I think the reality is that you have in your HTML the "send[X]"-formed elements and you're trying to use document.main.send?

    The elements are actually named "send[X]". Javascript/the DOM doesn't know about the special PHP array syntax you can use to name elements so that you get an array in $_POST. You have to get to them with those exact names
    Code:
    document.main["send[0]"]
    or go through document.main.elements looking for ones with the right name.
    Code:
    with (document.main.elements) {
        for (var i = 0; i < length; i++) {
            if (/^send\[[0-9]*\]$/.test(item(i).name)) {
                // ...
            }
        }
    }
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,622
    Rep Power
    595
    Ouch! That really complicates things. I guess I need to process them until I get an undefined condition to know how many there are? Assuming, of course, I can programmatically reference them.
    Code:
    var i=0;
    while (document.main["send["+i+"]"]!=undefined) {
    .
    .
    .
    i++;
    }
    P.S. I don't know what contradictions you found but it is more likely that I was not clear enough in my explanation.
    Last edited by gw1500se; January 21st, 2013 at 06:12 PM.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  6. #4
  7. Jealous Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    14,303
    Rep Power
    9400
    Well okay, maybe not "contradiction". I thought you were saying that you had the first bit of HTML in place but that didn't jive with the rest of your post. Then you were talking about how you needed it for arrays but obviously it's not possible with that code. So yeah, just a bit confused that's all.

    Anyways yes, you can get to them programmatically. By default objects can be treated like arrays so foo.bar and foo["bar"] are equivalent.
    Also, document.main.elements.length is your friend.
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,622
    Rep Power
    595
    Got it! Thanks.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  10. #6
  11. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,622
    Rep Power
    595
    I guess I don't "got it". I thought I understood what you were saying but obviously not as I can't get it to work. So how do I reference elements of the array programmaticaly? Everything I tried still comes back undefined. TIA.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  12. #7
  13. --
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2012
    Posts
    3,959
    Rep Power
    1014
    Hi,

    why not simply assign the elements a class and use that to reference them? That should be the cleanest and most efficient solution.

    You should also get rid of the "with" statement.
  14. #8
  15. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,622
    Rep Power
    595
    Thanks for the reply. To answer your question, I guess because I don't know how to do that either.

    Yes, the 'with' was removed some time ago.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.
  16. #9
  17. No Profile Picture
    Contributing User
    Devshed Expert (3500 - 3999 posts)

    Join Date
    Jul 2003
    Posts
    3,622
    Rep Power
    595
    I finally figured it out. I don't know why but creating the index in a separate variable worked where an embedded string did not.
    Code:
    var i=0;
    var box="send["+i+"]";
    while (document.main[box]!=undefined) {
       .
       .
       .
       i++;
       box="send["+i+"]";
    }
    I don't know why that is logically different than what I posted earlier.
    Code:
    while (document.main["send["+i+"]"]!=undefined) {
    Last edited by gw1500se; January 22nd, 2013 at 01:58 PM.
    There are 10 kinds of people in the world. Those that understand binary and those that don't.

IMN logo majestic logo threadwatch logo seochat tools logo