jquery: retrieve submitted values for name in array format

Question

on submit, i need to collect the values for a series of checkbox fields with a common name in array format. i tried doing something like:

$('form').submit(function(e){   
  $(':input:checkbox[name=fields[]]', this).each(function(){
    console.log($(this).attr('name'));
    console.log($(this).val);
  });
});

but the "[name=fields[]]" doesn't restrict the way i think it should. what i eventually need to do is determine how many checkboxes have been checked from that fields array. i'm just sending to the console log while i figure out the conditions.

can you make a demo on jsfiddle.net with your html and js so we can all see what you see? — Naftali
– Naftali, Commented Jun 13, 2011 at 16:53

daybreaker · Accepted Answer · 2011-06-13 18:44:42Z

4

Edited:

$('form').submit(function(e){   
    var fields = new Array();
    $(':input:checkbox[name*=fields]', this).each(function() {
        index_a = $(this).attr('name');
        if (fields[index_a] == undefined) fields[index_a] = 0;
        if ($(this).is(':checked')) fields[index_a] += 1;
    });
    return false;
});

http://jsfiddle.net/daybreaker/7UFs6/3

This will return a fields array with keys for each fields[whatever] and a value equal to how many checkboxes are checked within each field[whatever].

In my jsfiddle example, I use fields[opt1] and fields[opt2], and though technically probably not a good idea at all to have a key with brackets in it, it works. If you want, you could do some regular expressions to pull out the opt1 inside and make that the key.

edited Jun 13, 2011 at 18:44

answered Jun 13, 2011 at 17:01

daybreaker

1,4401 gold badge11 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

lcdservices Over a year ago

the field names are: <input name="fields[opt1]" /> so your second suggestion works great if I remove the name filter (except that it captures other inputs I want ignored), but it doesn't work with it.

lcdservices Over a year ago

your earlier suggestion was very simple and elegant. so i tried a combo of the earlier version with the revised: count = $(':input:checkbox:checked[name*=fields]', this); and it seems to be working. any gotchas that you can see?

daybreaker Over a year ago

It looks like that should work. And then the result array would only have keys for checkbox groups that have at least one box checked. Like I said before, one gotcha might be having an array key like count[fields[opt1]], but it seems to work in Chrome at least.

lcdservices Over a year ago

found the gotcha. works fine in chrome and FF, but not IE (surprise, surprise). i'll try your second recommendation.

lcdservices Over a year ago

think i need to play with the earlier model some more. your revised code does too much. the fields array doesn't have duplicate keys -- i'm just counting checked elements in that single array. for example, the form fields are named: fields[opt1], fields[opt2], fields[opt3], fields[opt4] -- two of these may be checked, which should yield a count of 2.

|

Collectives™ on Stack Overflow

jquery: retrieve submitted values for name in array format

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related