dynatable ajax sort not working

1.4k Views Asked by At

When building my table from JSON with Ajax,the sort is not working. It's active, and the asc/desc symbol changes, but nothing visibly changes. What's wrong?

I've added the samples below.

This is the JSON file

{
  "kennis": [
    {
      "kennisartikel": "Marcel Doesburg",
      "cascade": "CINI01\Internet\2 FMI Phase\PBI\Tridion Manual training April 2012.doc",
      "link": "<a href=''>OPEN</a>",
      "tags": "bla,bla"
    },
    {
      "kennisartikel": "Fredwin",
      "cascade": "CINI01\Internet\2 FMI Phase\PBI\Tridion Manual training April 2012.doc",
      "link": "<a href=''>OPEN</a>",
      "tags": "bla,bla"
    },
    {
      "kennisartikel": "Jantje H",
      "cascade": "CINI01\Internet\2 FMI Phase\PBI\Tridion Manual training April 2012.doc",
      "link": "<a href=''>OPEN</a>",
      "tags": "bla,bla"
    }
  ],
  "queryRecordCount": 4,
  "totalRecordCount": 4
}

This is my HTML

   <table id="kennistabel" class="tablesorter">
        <thead>
            <tr>
                <th width="33%" data-dynatable-column="kennisartikel" data-dynatable-sorts="kennisartikel" class="dynatable-head" data-dynatable-default-sort="true">Kennisartikel</th>                 
                <th width="40%" data-dynatable-column="cascade" data-dynatable-no-sort="true">Cascade</th>
                <th width="7%" data-dynatable-column="link" data-dynatable-no-sort="true">Link</th>
                <th width="20%" data-dynatable-column="tags" data-dynatable-no-sort="true">Tags</th>
            </tr>
        </thead>
        <tbody id="kennisbank">             
        </tbody>

</table>

And this is the Javascript

$(document).ready(function () {
    $("#kennistabel").dynatable({
        dataset: {
            ajax: true,
            ajaxUrl: '//www.tourdejunior.nl/kennisbank/cskennisbank.json',
            ajaxOnLoad: true,           
            records: []
        },
        features: {
            paginate: false,
            search: false,
            recordCount: false,
            sort: true,
            pushState: false,
            perPageSelect: false
        }   
    });
});
1

There are 1 best solutions below

0
On

A little late , but had the same issue... try the js file they use on their own demopage: https://s3.amazonaws.com/dynatable-docs-assets/js/jquery.dynatable.js