Getting value of selected checkbox with jquery from checkboxes without id's

Question

I have a number of checkboxes that are generated from a JavaScript API call from a database. I need to be able to pass the values of the checkboxes which are then selected by the user, and sent to the processing page. The issue is that the checkboxes don't have ID's associated with them(or this wouldn't be a problem) They all have the same name, but no ID's.

What is the best way to find which check boxes are selected, and pass their values to the following page?

One way I started was with an array:

var options = ["option1","option2","option3"];

var option 1 = [0];
var option 2 = [1];
var option 3 = [2];

On the processing page, using:

var option1 = getFromRequest('option1') || '';
var option2 = getFromRequest('option2') || '';
var option3 = getFromRequest('option3') || '';

Is there a better way of doing this?

I've changed the implementation to the following:

var values = []
$("input:checkbox.subIndustry").each(function(){
            values.push(this.value);
 });

passing the values to the success page with

window.location.href = REGISTER_SUCCESS +'&values='values.join(",")

which should then get the value with

 var variablname = getFromRequest('values') || "";

This is returning Undefined. Any help?

See: http://stackoverflow.com/questions/4813219/jquery-checkbox-value — Dylan N, Jun 11 '13 at 17:46

SpYk3HH · Answer 1 · 2013-06-11T18:15:48.867

An easy way to select them would be something like $("input[type=checkbox]:checked")

However, if you wanted to keep up with them as they are checked, even if they are added after you load, you could create a variable, then asign a delegation to the "change" state of each input that is a checkbox and update this variable on each change.

It's as simple as:

var checked, checkedValues = new Array();
$(function() {
    $(document).on("change", "input[type=checkbox]", function(e) {
        checked = $("input[type=checkbox]:checked");

        // if you wanted to get an array of values of the checked elements
       checkedValues = checked.map(function(i) { return $(this).val() }).get();
        // make a string of the values as simple as joining an array!
        var str = checkedValues.join();  // would return something like: value1,value2,ext...
    });
})

Working Example

Got to love that `.map()` function +1 – tymeJV Jun 11 '13 at 18:12 — tymeJV, Jun 11 '13 at 18:12
@tymeJV one of the best features of jQuery! :D – SpYk3HH Jun 11 '13 at 18:14 — SpYk3HH, Jun 11 '13 at 18:14

score 0 · Answer 2 · answered Jun 11 '13 at 17:54

0

Since all your checkboxes have the same name, you can retrieve the checked ones using a variation of:

var checked = $('input[name=ckboxname]:checked');

see: :checked selector for more information

answered Jun 11 '13 at 17:54

dc5

12,341
2
35
47

The problem using `:checked`, is that it sets the checkbox to "checked" state by default. It doesn't perform check to see if the box has been checked. – Matt Jun 11 '13 at 20:07

score 0 · Answer 3 · edited Jun 11 '13 at 18:17

0

you can simply get the values of checked checkboxes by using

$('input[name=checkboxname]:checked').val();

this will give you the value of checkbox which is checked and for all values simply use

each function of jquery.

edited Jun 11 '13 at 18:17

Andrew Barber

39,603
20
94
123

answered Jun 11 '13 at 18:01

rahul sharma

56
5

score 0 · Answer 4 · answered Jun 17 '13 at 15:15

0

Turns out, the answer was to utilize indexOf in the underscore.js library. The solution had to be applied in the API being used to send data.

(_.indexOf(values, '9') != -1 ? 1 : '0'),

answered Jun 17 '13 at 15:15

Matt

1,561
5
26
61

Getting value of selected checkbox with jquery from checkboxes without id's

4 Answers4

Working Example