'오름차순' + 1

1. 원본 내용

tablesorter 소개에 대해선 http://tablesorter.com/docs/에서 확인 가능.


2. 다운로드 

http://tablesorter.com/docs/#Download에서 다운로드


3. 사용하기

1) 헤더에 플러그인 포함하기

header.php

    




    Security
    
 
 
 
<-- option -->





});


2) 테이블에 class 값 입력하기

class="tablesorter" 이 클래스명은 변경하면 안된다. ( 적용 안됨 )

index.php

   
ID Auth Date User Source IP Remote IP Level
ID Auth Date User Source Remote Level
});


3) 스크립트 실행하기

- 기본 실행 방법

main.js

$(function(){
    $("#logtable").tablesorter();
});



- 컬럼별 오름차순 내림차순 적용하기

sortList: [[0,1]] 의 경우 1번째 컬럼의 1: desc 내림차순 (5,4,3,2,1) 정렬한다는 의미

sortList: [[3,1],[5,0]] 의 경우 4번째 컬럼의 desc 내림차순 정렬 , 6번째 컬럼의 asc 오름차순 정렬한다는 의미

$(document).ready(function() { 
    // call the tablesorter plugin 
    $("#logtable").tablesorter({ 
        // sort on the first column, order asc [coulum num,asc=0 or desc=1]
        sortList: [[0,1]] 
    }); 
}); 

});



4) 여러가지 데모 및 예제

데모 확인 하기  http://tablesorter.com/docs/#Demo  

예제 확인 하기 http://tablesorter.com/docs/#Examples 






'Programming > Script' 카테고리의 다른 글

[ CSS ] 네비게이션바 링크  (0) 2017.08.08
,