Get one of checkbox value with multiple checkbox using jquery

Question

I'm trying to get checkbox value from multiple checkbox.I have code as below:

 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="a" ng-model="todo.done">
 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="b" ng-model="todo.done">
 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="c" ng-model="todo.done">
 <input class="ng-pristine ng-valid" type="checkbox" name="ch" value="d" ng-model="todo.done">

what I want: when I check on checkbox,it will alert the value of checkbox. I have jquery code as below:

  $('input[type="checkbox"]').change(function() {
$('input[type="checkbox"]').each(function() {
    if ($(this).is(':checked')) {
    //the problem in here when I alert it will display many time with the other value of checkbox
    //what I need: I want to get only value of it when I check on it.
        alert($(this).prop('value'));
    }
});
});

Anyone please kindly help me, Thanks.

Arun P Johny · Accepted Answer · 2013-09-11 04:08:12Z

3

There is no need to loop through the checkbox elements

$('input[type="checkbox"]').change(function () {
    if (this.checked) {
        alert(this.value);
    }
});

Demo: Fiddle

answered Sep 11, 2013 at 4:08

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

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

Comments

Khawer Zeshan · Accepted Answer · 2013-09-11 04:07:50Z

1

This should work like this

$('input[type="checkbox"]').change(function() {
if ($(this).is(':checked')) {
        alert($(this).attr('value'));
    }
});

FIDDLE

answered Sep 11, 2013 at 4:07

Khawer Zeshan

9,6568 gold badges43 silver badges63 bronze badges

1 Comment

Math chiller Over a year ago

$(this).attr("") and $(this).is("") can be this.

spicy · Accepted Answer · 2013-09-11 04:09:04Z

0

ok i know in php if you want to have the same name for you checkbox you need to put it in an array

<input class="ng-pristine ng-valid" type="checkbox" name="ch[1]" value="a" ng-model="todo.done">

etcetera, so im sure you have to loop through the array in jquery as well, sorry i dont konw the exact code off hand. :(

answered Sep 11, 2013 at 4:09

spicy

11 bronze badge

Comments

Raúl Juárez · Accepted Answer · 2013-09-11 04:09:35Z

0

Try this:

$('input[type="checkbox"]').click(function () {
     alert($(this).val());
});

answered Sep 11, 2013 at 4:09

Raúl Juárez

2,1591 gold badge19 silver badges17 bronze badges

Comments

Manish Sharma · Accepted Answer · 2013-09-11 04:11:40Z

0

try this,

$(this).val();

its working.

answered Sep 11, 2013 at 4:11

Manish Sharma

2,4562 gold badges18 silver badges33 bronze badges

Comments

sudhansu63 · Accepted Answer · 2013-09-11 04:18:46Z

0

try the following code. in your $(this) refers to the elemnets of $('input[type="checkbox"]').each, hence it repets for all checkbox. I have changed change event to click as this one is good to use rather than change.

  $('input[type="checkbox"]').click(function() {

    if ($(this).is(':checked')) {
               alert($(this).val());
    }

 });

answered Sep 11, 2013 at 4:18

sudhansu63

6,2204 gold badges41 silver badges55 bronze badges

Comments

Marcelo De Polli · Accepted Answer · 2013-09-11 04:32:57Z

0

Look more into each jQuery function... I think what you need is parameters inside the each function like each(function(i,element) {}) where i behaves as the iterator for the checkboxes and element can be used to reference that checkbox. I think the issue is because you're using (this), which is not referencing the exact checkbox.

I hope I led you in the right direction.

edited Sep 11, 2013 at 4:32

Marcelo De Polli

29.4k4 gold badges41 silver badges47 bronze badges

answered Sep 11, 2013 at 4:11

anz

1,0721 gold badge9 silver badges25 bronze badges

7 Comments

Math chiller Over a year ago

if you include more then i led you in the right direction, i will +1.

anz Over a year ago

ok...then you will be able to do almost every kind of thing related to the checkbox within the DOM structure....using parent and siblings.. for simple alert do alert(element.val())

Math chiller Over a year ago

i meant explain your answer better, and also add something to help the "asker" in his specific case.

Math chiller Over a year ago

although really the loop is unnecessary.

anz Over a year ago

ok, my first post in stackoverflow didn't go well....loop will allow for more flexible approach if you would require to add other stuffs later.

|

Collectives™ on Stack Overflow

Get one of checkbox value with multiple checkbox using jquery

7 Answers 7

Comments

1 Comment

Comments

Comments

Comments

Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

1 Comment

Comments

Comments

Comments

Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related