Select element inside id in jquery

Question

I have a checkbox inside jquery datatable which is created dynamically with the code below.

$('#SettingsDatatable').dataTable({
"order": [],
"dom": "Bfrtip",
"buttons": ["copy", "csv", "excel", "pdf", "print"],
"columnDefs": [{
   "targets": 0,
   "render": function (data, type, full, meta) {
   return '<input type="checkbox" ' + (data == 'True' ? 'checked' : '') + ' /> &nbsp;&nbsp;&nbsp;  <a href="#" data-toggle="modal" data-target="#" title="Edit"><i class="glyphicon glyphicon-pencil"></i></a>';

 }}

Now I want to select this checkbox with code below.

 $('#SettingsDatatable input[type="checkbox"]').on('click', function (event) {
                alert("Hello in");
});

But its not getting selected.

Update

$('#SettingsDatatable').on('click', 'input[type="checkbox"]', function (event) { 
     event.preventDefault();
     event.stopPropagation();

     return false;
});

Perhaps your checkbox listener runs before your check boxes are rendered — dee, Aug 22 '16 at 09:04
Looks like the checkbox isn't yet there on the DOM when you attempt to attach a click handler to it. Attach the handler to an element up the hierarchy (ex: `document`) which is present at the time of binding and specify `#SettingsDatatable input[type="checkbox"]` as the second argument to `.on(...)` — techfoobar, Aug 22 '16 at 09:04
do you want to make it check the checkbox when you click it??? — Shakir Ahamed, Aug 22 '16 at 09:05
@ShakirAhamed I don't want check uncheck to happen when clicked on checkbox. It should be freezed — Lara, Aug 22 '16 at 09:07

brk · Accepted Answer · 2016-08-22T09:10:18.570

2

Try this one

$('#SettingsDatatable').on('click','input[type="checkbox"]', function (event) {
                alert("Hello in");
});

edited Aug 22 '16 at 09:10

answered Aug 22 '16 at 09:08

brk

48,835
10
56
78

Its giving me syntax error – Lara Aug 22 '16 at 09:09
I have updated my posted with your code. Issue is that my event is not getting prevented. Checkboxes are still can be checked unchecked . How to stop ? – Lara Aug 22 '16 at 09:24
which event you want to prevent? – brk Aug 22 '16 at 09:26
Checkbox click event like this fiddle http://jsfiddle.net/DrKfE/3/ – Lara Aug 22 '16 at 09:37
Use `check` instead of `click` `$('#SettingsDatatable').on('check'.....` – brk Aug 22 '16 at 09:41
Added ` $('#SettingsDatatable').on('check', 'input[type="checkbox"]`, function (event) {` but result its not working – Lara Aug 22 '16 at 09:43
http://jsfiddle.net/DrKfE/314/ – brk Aug 22 '16 at 09:45
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/121518/discussion-between-lara-and-user2181397). – Lara Aug 22 '16 at 09:46
I am sorry to tell but Shared fiddle does not stop checkbox to be clicked.I need to prevent checkbox from being checked / Unchecked. – Lara Aug 22 '16 at 09:48

Select element inside id in jquery

1 Answers1