Search code examples
javascriptjquerybootstrap-table

Bootstrap table column default ordering using column options 'order'

I am trying to populate a bootstrap table using Json data and trying to have it sorted on one of the columns by default using column options (not table options) as mentioned in the docs page here: https://bootstrap-table.com/docs/api/column-options/#order
However, the order property seems to have no effect. I managed to accomplish the same using table options (sortName + sortOrder), but I was just wondering if I missed something or is the 'order' column option just not working as expected. Here's a snippet to show what I was trying:

$('#tbl_foo').bootstrapTable({
        columns: [
            {
                field: 'id',
                title: 'ID',
                sortable: true,
                order: 'desc'
            },
            {
                field: 'name',
                title: 'Name',
                sortable: true
            }
        ],
        data: data
});

The above doesn't work as expected but the below does:

$('#tbl_foo').bootstrapTable({
        columns: [
            {
                field: 'id',
                title: 'ID',
                sortable: true
            },
            {
                field: 'name',
                title: 'Name',
                sortable: true
            }
        ],
        data: data,
        sortName: 'id',
        sortOrder: 'desc'
});

Any pointers will be appreciated.

Solution

  • Since no one responded for a while, I decided to take a look at this again and realized something I had either initially missed or that the documentation has been updated. Either way, it seems that there is a column option with the same name as the table option 'sortName': https://bootstrap-table.com/docs/api/column-options/#sortname, which must be specified without which the order option seems to have no effect.

    P.S. I haven't tried this myself but I assume this would work if the 'sortName' column option is used along with the 'order' column option. In case it doesn't, I shall make a subsequent comment but until then, assume this to be the answer!