Question

我创建了YUI3 Datatable with Pagination（使用了gallery模块：gallery-datatable-paginator）。

    var withColumnLabels = new Y.DataTable({
        columns: columnDef,
        data   : data,
        summary: "Price sheet for inventory parts",
        caption: "These columns have labels and abbrs",
        sortBy: {"mfr_parts_database_name":"desc"},
        paginator: new Y.PaginatorView({
           model:      new Y.PaginatorModel({itemsPerPage:2}),
           container:  '#labelsPaginatorTemplate'
        })

    }).render('#labels');

演示：http://jsfiddle.net/mail2asik/MqwyU/5/

在上面的URL中，默认情况下在第二列中启用排序。渲染数据表之后，如果我要对第一列进行排序，则第二列排序图标不会更改为默认指示符。请有人建议我修复它。

如果我不使用gallery-datatable-paginator，它工作正常。

    var withColumnLabels = new Y.DataTable({
        columns: columnDef,
        data   : data,
        summary: "Price sheet for inventory parts",
        caption: "These columns have labels and abbrs",
        sortBy: {"mfr_parts_database_name":"desc"}
    }).render('#labels');

演示：http://jsfiddle.net/mail2asik/r3Cbu/6/

Answer 1

我已经使用“pageUpdate”事件解决了这个问题，但它不是完美的解决方案，因为它应该在核心级别修复。

    //pageupdate event
    withColumnLabels.on('pageUpdate', function (e) {
        var sortBy = this.get('sortBy');
        if(sortBy){
            Y.all(".yui3-datatable-table thead>tr>th").removeClass('yui3-datatable-sorted').removeClass('yui3-datatable-sorted-desc');    
            var sortObj = sortBy[0],
            sortKey = Y.Object.keys(sortObj)[0],
            key=sortObj[sortKey];           
            if(key=="1"){
                Y.one(".yui3-datatable-table .yui3-datatable-col-"+sortKey).addClass("yui3-datatable-sorted");
            }else{      
                Y.one(".yui3-datatable-table .yui3-datatable-col-"+sortKey).addClass("yui3-datatable-sorted").addClass("yui3-datatable-sorted-desc");
            }
        }
    });

http://jsfiddle.net/MqwyU/7/

排序问题：具有分页的YUI3数据表

1 个答案: