After using sDom I lose fnInfoCallback

ferenckun

Hi all,

I use the DataTables in my little project and I wanted to customise it. I needed an extra header with dynamically added buttons, selects and text boxes. So I started with sDOM. But after I add my own section to it the fnInfoCallback never again called after changing something with the default controls.

My table creation looks like:
table = $("#my-data-table").dataTable({
"aoColumns": headers,
"aaData": rows,
"bJQueryUI": true,
"fnInfoCallback": onInfoChanged,
"sPaginationType": "my_custom_buttons",
"sDom": '<"#customHeader"><"top"rt><"bottom"p><"clear">',
"bAutoWidth": false,
"bSort": true
});

After creating the table I fill the customHeader with my controls with help of jQuery. Before I needed to add my custom header the onInfoChanged method was called after every manipulation of the table. It worked correctly.

After using the sDom I can still sort the table on UI BUT the fnInfoCallback is called never again.

Have anyone meet with the same issue? Or did I just do something wrong?

Thanks in advance and best regards,
Ferenc

ferenckun

I forgot to mention that I use angular.js directive to create the table. Is it possible that it could be because I use angular?

allan

You don't have an into element ( `i` ) in your sDom, so the info callback will never fire.

Allan

ferenckun

Thanks a lot Allan!

I thought that "i" stands for the information text box. Which text box was in the examples on the bottom of the tables and showed "Showing 1 to 10 of 57 entries".

allan

It does - that's the information element - and what the fnInfoCallback relates to.

Allan