CODEWITHSUNDEEP
jquerydatatables
Sandeep Thomas
Sandeep Thomas

Reputation: 4759

jquery datatable sorts columns even when orderable false specified in columndefs

Im facing a strange problem with JQUERY Datatable plugin. I've a rating feature being used in every rows. The first cell actually holds the control for that purpose.

Here is the markup for the first cell

<input class="row-check" type="checkbox"><span class="fa-stack fa-lg star-rating">
<i class="fa fa-star goldstar  fa-stack-2x"></i>
<strong class="fa-stack-1x inside-text">4</strong> </span>

Here is the Datatable initialization code Im using

    var myTable = $("#tbl_main").dataTable({
    "dom": "<'tableinfobar'i><'tablesearchbox'f><'tablestarfilter'><'tablestarreset'><'tablebody't>S<'tablelength'l><'tablepaging'p>",
    "ordering": true,
    "columnDefs": [{ "targets": [0, 6], "searchable": false, "orderable": false }, 
{ "targets": [ 1, 3, 4, 5,  7, 8, 9], "orderable": false }, 
{ "targets": [2], "type": "html-num", "orderable": true}],
    "lengthMenu": [
        [10, 20, 50, 100, 500, -1],
        [10, 20, 50, 100, 500, "All"]
    ],
    "language": {
        "search": "Quick Search _INPUT_",
        "zeroRecords": "No assessments found with that search criteria.",
        "info": "Showing _START_ to _END_ of _TOTAL_ Assessments",
        "infoFiltered": " - filtered from _MAX_ entries",
        "lengthMenu": "Show _MENU_ Entries"
    }
}).show();

As you can see in the code, I disabled sorting for the first column in the columndefs. But still if some values inside the first cells Strong tags (In this case <strong class="fa-stack-1x inside-text">4</strong>) the whole table being sort descending based on that value. Means if any other rows having no rating values inside that strong tags in the first cell, the row with some values shows as the final row in the whole table.

What I did wrong here.

Upvotes: 6

Views: 5614

Answers (4)

Soadkf Ho
Soadkf Ho

Reputation: 1

"order": [[2, 'desc']],

added to the config will sort based on column number 2.

Upvotes: 0

Vishal
Vishal

Reputation: 717

In case anyone else is having the same issue: After some more research, it looks like this is actually intended behavior because the table is by default sorted on the first column. So the indicator is there to show you that the table is sorted on that column. In order to remove the indicator, you need to tell the table to default sort on a different column, or no column at all. In my case, I want my table sorted the same way the data is sent from the server, so I just passed in "order":[] as an option to the table, to disable the default sort.

Upvotes: 0

Sandeep Thomas
Sandeep Thomas

Reputation: 4759

I'm just specifying a detailed answer for my question. As Gyrocode mentioned, I solved the problem as I specified an additional option which is

order:[] //in the datatable initialization code.

This disabled the auto sorting the first column

Upvotes: 2

Gyrocode.com
Gyrocode.com

Reputation: 58900

Use order option to specify alternative column to sort. By default, it uses first column even if you disables sorting for that column.

Upvotes: 4

Related Questions