Rendering inputs in datatable do not fire events

Fransolo83

Hi everyone,

My example with the code:
https://live.datatables.net/kidazeso/2/

I want to render inputs in column one of my datatable. I am trying to add events to these inputs. In the example, only in row one, and column one, just to test. But the event when I change the input, is not fired. I tried with "on change" event, but It happens with other events as well.

These code works fine in version one of datatable. If I add the event outside the datatable render, it works correctly in version two as well.

Is this a bug, or is this done on purpose because of something?

Thank you!

allan

Correct. You are returning a string:

return input.prop('outerHTML');

So while DataTables renders the element, it is not the one you created with the event listener. It is an entirely new one!

I would encourage you to use a delegated event instead:

https://live.datatables.net/kidazeso/4/edit .

Also, while it is possible to show input elements in the DataTable cells, you need to think carefully about the tradeoffs. For example, you should really update the cell's data as the input changes to allow for sorting and filtering impact. It gets a bit messy.

Allan