如何使用带有类的Jquery从动态创建的复选框中获取值

Question

I am trying to get the value from checkbox when checked which is created dynamically with jquery associated with html table am using class to get the value but am unable to get it

My code is like this

Input created with Jquery

"<td><div class=" + "checkbox checkbox-primary" + "><input type=" + "checkbox" + " class=" + "cbCheck" + " value=" + "" + data.d[i].Rowname + "" + "" + data.d[i].one + "" + "></div></td>"

Jquery to get the value

$("#table").on(":checked", ".cbCheck", function () {
    var id = $(this).attr("value");
    alert(id);
});

Please help me how to fix this.

Thanks in advance

Answer 1

Working Fiddle

Try:

$('table tr td').on('click','.cbCheck',function() {
  if ($(this).is(':checked')) {
    alert($(this).attr('id'))
  }
  else
  alert('unchecked');
});

Answer 2

Use 'change' event:

$("#table").on("change", ".cbCheck", function () {
    var id = $(this).attr("value");
    alert(id);
});

Answer 3

Instead of creating it like that use Create element and add id dynamically then use your function I guess it will work, actually worked in my case

var newCheckBox = document.createElement('input');
newCheckBox.type = 'checkbox';
newCheckBox.id = 'ptworkinfo';

Answer 4

You can do using following for dynamically created elements:

$(document).on("click", ".cbCheck", function () {
    var value=$(this).attr("value");
    alert(value);
});