Jquery: getting value of input checkbox using common class and change()

Question

I have a table of values and need to get the value of a row's checkbox. What is happening is: If I have a table with 4 rows of data and select the top row, the binding event is being fired for each corresponding row in the table with the same class name. I only want it to fire once and return the value of the row's checkbox that was changed (need both checked and unchecked trigger). Any help is appreciated.

See my fiddle at http://jsfiddle.net/radi8/MgFuu/5/.

I am using the following class (fixed using suggestions by Rob W and Richard D, thanks guys!):

 var RequiredField = {
     init: function() {
         // bind a control structure around the PSN selection table
         var psn = $(".psnselect");
         //for (var i = 0, ii = psn.length; i < ii; i++) {
         //    $(psn).change(RequiredField.psnSelect);
         //}
         psn.change(RequiredField.psnSelect);

     },
     psnSelect: function(event) {
         var evtName = event.currentTarget.name;
         var checked = event.currentTarget.checked;
         var val = event.currentTarget.value;
         alert('PSN Selection: ' + evtName);
     }
 };
 RequiredField.init();

Rob W · Accepted Answer · 2012-01-12 16:40:05Z

1

Remove the for loop. jQuery automatically attaches events to all elements which match the selector. psn is already a jQuery object, so the $ wrapper can also be omitted:

psn.change(RequiredField.psnSelect);

Fixed demo: http://jsfiddle.net/MgFuu/6/

If you want to select the nth element of a jQuery collection, either of these methods can be used:

var n = 0;    // The first element (index 0)
psn.eq(n);    // = jQuery wrapped first element
psn.get(0);   // = DOM element
psn[0];       // = psn.get(0) = DOM element

answered Jan 12, 2012 at 16:40

Rob W

350k87 gold badges811 silver badges683 bronze badges

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

Comments

Richard Dalton · Accepted Answer · 2012-01-12 16:41:22Z

0

No need to have the for loop.

init: function() {
    $(".psnselect").change(RequiredField.psnSelect);       
},

The event will automatically be bound to all elements that match the selector

http://jsfiddle.net/infernalbadger/MgFuu/7/

answered Jan 12, 2012 at 16:41

Richard Dalton

35.8k6 gold badges75 silver badges92 bronze badges

Collectives™ on Stack Overflow

Jquery: getting value of input checkbox using common class and change()

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related