jQuery Datatable.js sorting and searching functionality

Question

I am currently using NEOS CMS and on my site there are a lot of tables which are added by editors directly using the backend and no code is needed. The table are now needed to be sortable via the jquery datatable plugin. The problem is that the plugin requires the table to have a thead tag to identify table headers. Like below

<table>
    <thead>
      <tr>
        <th>Column 1</th>
        <th>Column 2</th>
      </tr>
    </thead>
    <tbody>
    <tr>
      <td>Data1</td>
      <td>Data2</td>
    </tr>
    <tbody> 

</table>

But the NEOS CMS creates table in the follwing format

    <table>
        <tbody>
          <tr>
            <th>Column 1</th>
            <th>Column 2</th>
          </tr>
        <tr>
          <td>Data1</td>
          <td>Data2</td>
        </tr>
        <tbody> 

    </table>

Hence the jQuery is not able to find the thead and doesn't work. My question is, is there any workaround for this problem in the plugin so it works with the format. Or any other javascript library which does everything like datatables ?

Thanks in advance.

Answer 1

In the new User Interface you can enable the CK Editor 5. There you can set much more properties in the table like head, etc.

I made a short test and I got following code:

<table>
    <thead>
        <tr>
            <th scope="col">test</th>
            <th scope="col">test</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Entry</td>
            <td>Entry</td>
        </tr>
        <tr>
            <td>Entry</td>
            <td>Entry</td>
        </tr>
    </tbody>
</table>

Here is a short article about Neos and the editor: https://www.neos.io/blog/neos-is-in-love-with-ckeditor5.html

Do you know, that Neos has is own Discourse and also a Slack? Here you'll find all the links: https://www.neos.io/docs-and-support/support.html