2014-04-25 6 views
-1

페이지 매김을 사용하여 YUI3 데이터 테이블을 만들었습니다 (갤러리 모듈 : 갤러리 - 데이터 테이블 - 페이지 생성기 사용).정렬 문제 : YUI3 페이지 표시기로 데이터 테이블

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'); 

데모 : 위의 URL에서 http://jsfiddle.net/mail2asik/MqwyU/5/

, 정렬은 두 번째 열에서 기본적으로 사용하도록 설정되어 있습니다. 데이터 테이블 렌더링 후 첫 번째 열을 정렬하려고하면 두 번째 열 정렬 아이콘이 기본 표시기로 변경되지 않습니다. 누구든지 저를 고쳐달라고 제안하십시오.

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/

답변

0

나는 "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/