I have multiple checkboxes in a for each loop all with different data attributes.
<input data-pid="<?php echo $name ?>" class="live" name="live" id="live" type="checkbox" value="">
In JQuery I am trying to fetch the data attribute of the checked option and whether it is checked or not.
$(".live").click(function() {
var n = this.id
var a = this.attr("data-pid");
I don't seem to be able to get the id or attr
https://jsfiddle.net/nydo9ues/1/
$('.live').change(function(){
var chkbx=$(this);
console.log(chkbx.data());//Will give you a JSON Object with your data https://api.jquery.com/data/
console.log(chkbx.attr('id'));//id of the element changing
console.log(chkbx.is(':checked'));//Status of the checkbox
});
attr() is a jQuery method so you have to use $(this).attr() not this.attr()
$(function() {
$(".live").change(function() {
var n = this.id
var a = $(this).attr("data-pid");
console.log('id=', n, ' pid=', a , ' checked=', this.checked)
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" data-pid="1" id="live_1" class="live">
<input type="checkbox" data-pid="2" id="live_2" class="live">
<input type="checkbox" data-pid="3" id="live_3" class="live">
<input type="checkbox" data-pid="4" id="live_4" class="live">
<input type="checkbox" data-pid="5" id="live_5" class="live">Use your console to check for errors. You should have seen one for this.attr() is not a function
this.checkedto see if it is checked or notvar a = this.attr("data-pid");tovar a = $(this).attr("data-pid");