数据表 - 如何在未显示所有列时禁用表中最后一列的排序

I have a table that looks like this:

我有一个看起来像这样的表:

JS:

"columns": [
            {
                "data": 0,
                "iDataSort" : 0
            },
            {
                "data": 1,
                "iDataSort" : 1,
                "render": function ( data, type, row ) {
                    var returnString = data;
                    if( row[2] !== null && row[2].length > 0){
                        returnString += "<ul>";
                        for( var alternativeTitle in row[2] ){
                            returnString += "<li>" + row[2][alternativeTitle] + "</li>"
                        }
                        returnString += "</ul>"
                    }
                    return returnString;
                }
            },
            {
                "iDataSort" : 3,
                "data": 3
            },
            {
                "iDataSort" : 4,
                "data": 4
            },
            {
                "data":null,
                "bSearchable": false,
                "bSortable": false,
                "sClass": "center",
                "render": function (row) {
                    return '<a href"#">Edit</a>';
                }

            }

        ],

HTML :

        <table>
            <thead>
            <tr role="row" class="heading">
                <th>
                    Id#
                </th>
                <th>
                    Original title (alternative titles)
                </th>
                <th>
                    Year of production
                </th>
                <th>
                    Country
                </th>
                <th>
                    Actions
                </th>
            </tr>
            </thead>
            <tbody>
            </tbody>
        </table>

As you can see, I provide a 5 column array as a data source (id, title, alternative titles[], year of production and country) but I render them differently (original title and alternative titles go in the same column while the last column is for action buttons). Now I want to disable sorting on the last column (as that would make no sense, because its reserved for buttons) but when I put "bSortable": false on the last column with buttons, it affects the last column visually, but also affects the GET sent by datatables, in effect when I click on "sort by country", nothing happens, because datatables sends "bSortable_4 = false to the server.

正如您所看到的,我提供了一个5列数组作为数据源(id,标题,替代标题[],生产年份和国家/地区)但我以不同的方式呈现它们(原始标题和替代标题在同一列中排在最后列用于操作按钮)。现在我想禁用最后一列的排序(因为它没有任何意义,因为它保留了按钮)但是当我把“bSortable”:false放在带有按钮的最后一列时,它会直观地影响最后一列,但也影响数据表发送的GET,实际上当我点击“按国家/地区排序”时,没有任何反应,因为数据表将“bSortable_4 = false”发送给服务器。

I want to be able to sort on the Country column, but to disable sorting on the Actions column. How to achieve this?

我希望能够对Country列进行排序,但是要禁用Actions列上的排序。怎么做到这一点?

1 个解决方案

#1

Here is the html

这是html

<table id="example">
            <thead>
            <tr role="row" class="heading">
                <th>
                    Id#
                </th>
                <th>
                    Original title (alternative titles)
                </th>
                <th>
                    Year of production
                </th>
                <th>
                    Country
                </th>
                <th>
                    Actions
                </th>
            </tr>
            </thead>
            <tbody>
            <tr><td>1</td><td>1</td><td>1</td><td>1</td><td>delete</td></tr>
            <tr><td>2</td><td>2</td><td>4</td><td>5</td><td>delete</td></tr>
            </tbody>
        </table>

Here is javascript

这是javascript

$(document).ready(function() {
$('#example').dataTable({
"order": [],
"aoColumnDefs": [
          { 'bSortable': false, 'aTargets': [ 4 ] }
       ],
});
});

Here is working fiddle https://jsfiddle.net/rtn6496n/10/

这是工作小提琴https://jsfiddle.net/rtn6496n/10/

Hope it helps !

希望能帮助到你 !

#1