bootstrap-table 排序 th中设置data-sort-name无效果？

Question

展示字段和排序字段不同。

<th data-field="userCode" data-sortable="true" data-sort-name="user_code">用户编码</th>

function queryParams : function(params) {
    return $.extend({}, params, {
        "page.pageSize" : params.limit,
        "page.offset" : params.offset,
        "page.sort" : **params.sort**,
        "page.order" : params.order,
        "model.search" : params.search
    });
}
queryParams 取到的sort一直是userCode 而不是user_code
对了是server分页 我跟源码看到

这里设置的sort-name

这里到

 if (this.options.sidePagination === 'server') {
        return;
    }

就直接返回了。

这样的看来的话就是说server端的分页不支持定义的sortName嘛~？求大神

Answer 1

赞！ 解决了。多谢楼上

Answer 2

应该是不行，自己重写了几个方法。
目前已经可以正常使用。
标注的部分为修改的部分

完成代码如下：

!function($) {
    'use strict';

    var BootstrapTable = $.fn.bootstrapTable.Constructor;
    BootstrapTable.prototype.onSort = function (event) {
        var $this = event.type === "keypress" ? $(event.currentTarget) : $(event.currentTarget).parent(),
            $this_ = this.$header.find('th').eq($this.index()),
            sortName = this.header.sortNames[$this.index()];

        this.$header.add(this.$header_).find('span.order').remove();

        if (this.options.sortName === $this.data('field')) {
            this.options.sortOrder = this.options.sortOrder === 'asc' ? 'desc' : 'asc';
        } else {
            this.options.sortName = sortName || $this.data('field');
            this.options.sortOrder = $this.data('order') === 'asc' ? 'desc' : 'asc';
        }
        this.trigger('sort', this.options.sortName, this.options.sortOrder);

        $this.add($this_).data('order', this.options.sortOrder);

        // Assign the correct sortable arrow
        this.getCaret();

        if (this.options.sidePagination === 'server') {
            this.initServer(this.options.silentSort);
            return;
        }

        this.initSort();
        this.initBody();
    };
    BootstrapTable.prototype.getCaret = function () {
        var that = this;

        $.each(this.$header.find('th'), function (i, th) {
            var sortName = that.header.sortNames[i];
            $(th).find('.sortable').removeClass('desc asc').addClass((sortName || $(th).data('field')) === that.options.sortName ? that.options.sortOrder : 'both');
        });
    };
}(jQuery);

Answer 3

大晚上的 ,挖个坟, 碰巧遇到这个问题,顺着 @十一年 的代码测试,发现不太对劲,如果有隐藏列 会bug,贴下我改的:

!function($) {
    'use strict';

    var BootstrapTable = $.fn.bootstrapTable.Constructor;
    BootstrapTable.prototype.onSort = function (event) {
        var $this = event.type === "keypress" ? $(event.currentTarget) : $(event.currentTarget).parent(),
            $this_ = this.$header.find('th').eq($this.index());

        this.$header.add(this.$header_).find('span.order').remove();

        if (this.options.sortName === $this.data('field')) {
            this.options.sortOrder = this.options.sortOrder === 'asc' ? 'desc' : 'asc';
        } else {
            this.options.sortName = $this.data('sort-name') ? $this.data('sort-name') : $this.data('field');
            this.options.sortOrder = $this.data('order') === 'asc' ? 'desc' : 'asc';
        }
        this.trigger('sort', this.options.sortName, this.options.sortOrder);

        $this.add($this_).data('order', this.options.sortOrder);

        // Assign the correct sortable arrow
        this.getCaret();

        if (this.options.sidePagination === 'server') {
            this.initServer(this.options.silentSort);
            return;
        }

        this.initSort();
        this.initBody();
    };
    BootstrapTable.prototype.getCaret = function () {
        var that = this;

        $.each(this.$header.find('th'), function (i, th) {
            var sort_class = $(th).data('field') === that.options.sortName || $(th).data('sort-name') === that.options.sortName ? that.options.sortOrder : 'both';
            $(th).find('.sortable').removeClass('desc asc').addClass(sort_class);
        });
    };
}(jQuery);