Datatable Rendering Problems

Datatable Rendering Problems

jon.bluksjon.bluks Posts: 15Questions: 0Answers: 0
edited April 2009 in General

I'm having some difficulty with the rendering of the DataTables.

Using IE 7, it renders fine, except on one of my pages It doesn't render. If I don't turn the table into a datatables object, then the content renders, but once I do $("table").dataTables(); the the content of the table disappears. The paging and search stuff is there, but the rows aren't displayed. Looking at the content in a DOM browser shows that the rows are there. The scenario is a search screen. The user click's search, and the results are returned. The resulting table is placed in a div that is hidden, then datatables is called, and the div is made visible. I thought it might be because the div is made visible and something happens that the rows aren't visible, but it was working before. Any thoughts as to why this might be or suggestions on where to look for the solution?

Secondly, The rendering in Firefox is really weird. The table is broken up with the search/paging bars broken up over two lines, and the rows shifted to the right. I have adjusted the width of the search/paging, so that might have something to do with it.

I would be happy to post code or screen shots or even provide a login to the site if that is helpful.




  • allanallan Posts: 60,929Questions: 1Answers: 9,932 Site admin
    Hi Jonathan,

    1. IE7: This sounds very odd - it works most of the time, but not on a certain page. Have you got the correct number of header column elements, matching the number of columns in tbody. When those are out, DataTables gets a bit lost (although it should normally give a warning). If you could post an example that would be great. Alternatively you could give me a log-in if you like:

    2. You will probably need to adjust the demo styles that DataTables ships with. There is a width being applied to the info div, and possibly padding/margin around that area as well. Using something like Firebug or Webkit's Inspector will help to diagnose this kind of problem.

This discussion has been closed.