2017-11-08 6 views
0

나는 내림차순으로 첫 번째 열을 기준으로 기본 정렬 인 JQuery Datatable을 사용합니다.열 기본 정렬 화살표 재정렬

의 표 자체는 잘 작동하지만 테이블이 그려진 후에 나는 아래의 스크린 샷에 빨간색 원이있는, 화살표 버튼을 재정렬 컬럼의 동작을 변경하는 것을 시도하고있다 :

column reordering behaviour i want to change

이 작은 화살표 버튼을 클릭하면 테이블이 순서로 정렬됩니다. 클릭 한 열의 순서는 처음으로입니다. 예를 들어 열의 화살표를 한 번 클릭하면 테이블이 다음과 같이됩니다. 이 날짜에 대해 오름차순으로 정렬됩니다 (가장 오래된 날짜가 추가됨). 첫째, 내가 원하는하지 않은 테이블의 위쪽)에 나타납니다 :

behaviour I have right now

테이블이 클릭에 순서 내림차순 에 주문을 위해 내가 무엇을 찾고 있어요 것은 두 번 클릭하지 않아도됩니다 (한 번 오름차순으로 가져 오기 위해 한 번 내림차순으로 다시 한 번 클릭). 기본적으로 내가 첫 번째 클릭에이 결과를 얻기 위해 노력하고있어,하지만 난 단지 두 번째 클릭에 무엇입니까 :

behaviour I want on first click

나는 동작을 변경하기 위해 내 테이블 코드에 추가 할 수있는 간단한 설정이 있습니다 열의 화살표 순서 변경? 나는 그들의 API과 과거의 몇 가지 StackOverflow 질문을 들여다 보았지만 내 문제와 관련된 것을 찾을 수 없었다. 사전에

self.table = table_dom.DataTable({ 
    serverSide: true, 
    dom: "<'row'<'col-md-3'l><'col-md-5 text-right'B><'col-md-4'f>>" + 
     "<'row'<'col-md-12'tr>>" + 
     "<'row'<'col-md-5'i><'col-md-7'p>>", 
    ajax: '...', 
    columns: [ 
     {data: 'legacy_description', name: 'legacy_description', title: 'P', width: '20px'}, 
     ... 
     {data: 'created', name: 'created', title: 'Date Created (UK)', width: '150px'}, 
    ... 
    ], 
    order: [[0, 'desc']], 
    responsive: true, 
    pageLength: 10, 
    ... 
}); 

감사합니다 : 당신이 모습을 갖고 싶어

여기 내 코드입니다.

답변

1

columns.orderSequence을 사용하여 각 열의 순서를 사용자 정의하십시오. 예를 들어

가 먼저 내림차순으로 세 번째 열을 정렬하려면, 아래의 코드를 사용 속임수를 썼는지

$('#example').DataTable({ 
    "columnDefs": [ 
    { "orderSequence": [ "desc", "asc" ], "targets": [ 2 ] } 
    ] 
}); 
+0

감사합니다! –