Datatables works on certain tables but not others.

  • Resolved Jason

    (@zushiba)


    7 years, 1 month ago

    I have a test table that’s written in plane HTML, the datatables plugin works great for that simple table. But if I attempt to use the plugin in conjunction with a table that’s generated via another plugin and inserted /w a shortcode, the table style is applied, the search box appears but sorting/searching doesn’t work.

    Any idea what might be the cause? The table is generated as plain HTML and for all intents and purposes should work just fine.

    When I look at the table, the datatable plugin seems to be mangling the table, adding extraneous <theads> that seem to be causing it to render the actual table sorting/searching features inoperable.

    • This topic was modified 7 years, 1 month ago by Jason.
Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author samsk

    (@samsk)

    Hi, this setup should work, because whole the magic is client side javascript, so it’s applied after whole HTML ‘comes’ to web browser. But you are right, the problem might be in incorrect structure of your table. Try to copy the generated table to some test page and apply the Datatables on it, and maybe try modifying it until it works.

    I’m using this plugin almost the same way as you are intending to. The initial HTML table is generated in search engine and ‘live’ included in page using my Include URL plugin. Then I’m doing server side search/filtering, where search engine returns JSON to Datatables. You can see it here: https://dob.sk/aplikacie/financna-sprava/variabilny-symbol/rok-2017/.

    Hello!
    I do not understand. What should I do to get Datatables connected?
    I use the content of the page:

    [wp-datatable id="mtable" fat="1"]
    paging: true,
    responsive: true,
    ordering: true,
    buttons: [
        'copy', 'csv'
    ]
[/wp-datatable]
<table id="mtable">
<tbody>
<tr>
<td>Title 1</td>
<td>Title 2</td>
<td>Title 3</td>
</tr>
<tr>
<td>Content 1</td>
<td>Content 2</td>
<td>Content 3</td>
</tr>
</tbody>
</table>

    This does not work.

    Plugin Author samsk

    (@samsk)

    Without testing it, I think the table should look like this:

    <table id="mtable">
<!-- table head with header columns -->
<thead>
<tr>
  <th>Title 1</th>
  <th>Title 2</th>
  <th>Title 3</th>
</tr>
</thead>

<!-- data -->
<tbody>
<tr>
<td>Content 1</td>
<td>Content 2</td>
<td>Content 3</td>
</tr>
</tbody>
</table>

    Added THEAD section, and header columns are TH now. Without it, Datatables can have problem to identify what is your header.

    Thanks, it helped!

    Plugin Author samsk

    (@samsk)

    Good.
    Please rate the plugin if you like it ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Datatables works on certain tables but not others.’ is closed to new replies.