cleanzone 템플릿 - 표 플러그인 jquery.datatables
2951 단어 cleanzone
/*Data Tables*/
var dataTables = function(params){
//Basic Instance
$("#datatable).dataTable();
//Search input style
$('.dataTables_filter input').addClass('form-control').attr('placeholder','Search');
$('.dataTables_length select').addClass('form-control');
};//End of dataTables
기본적인 호출일 뿐 매개 변수가 전달되지 않은 것을 볼 수 있다.
첫 번째 열을 정렬할 수 없게 하려면 아마도 멍청한 사람일 것이다. 하루 종일 고생을 한 끝에 위의 함수를 다음과 같이 수정했다.
/*Data Tables*/
var dataTables = function(params){
//Basic Instance
// $("#datatable).dataTable();
var orderable = null; // , boolean ,
var targets = null; //
var aaSorting = null; // ,jquery.dataTables "aaSorting": [[0,'asc']],
if(!(typeof(params) == "undefined")){
var columnDefs = params.columnDefs;
if(!$.isEmptyObject(columnDefs)){ //
orderable =typeof (columnDefs.orderable)!="boolean"?true:columnDefs.orderable;
targets = columnDefs.targets==""?null:columnDefs.targets;
}
aaSorting = $.isEmptyObject(params.aaSorting)==true?[[0,'asc']]:params.aaSorting; // aaSorting ,
}
$('#datatable').dataTable( {
aaSorting:aaSorting,
"columnDefs": [ {
"orderable": orderable,
"targets": targets
}]
/*"columns": [
{ "orderable": false },
{ "orderable": false },
null,
null,
null
]
*/
} );
//"aaSorting" : [[0,""],[1, "asc"]] // , 2 ,
//"bSort":false //
//Search input style
$('.dataTables_filter input').addClass('form-control').attr('placeholder','Search');
$('.dataTables_length select').addClass('form-control');
};//End of dataTables
general도 수정했습니다.js의 다른 부분은 매개 변수를 전달했을 뿐입니다.
dataTables: function(paras){
dataTables(paras);
},
페이지에서 호출할 때:
$(document).ready(function(){
//initialize the javascript
App.init();
//App.dataTables();
//App.dataTables({"columnDefs":{"orderable":false,"targets":[0,2]}});
App.dataTables({"aaSorting":[[0,""]],"columnDefs":{"orderable":false,"targets":[0,2]}});
});
cleanzone 템플릿에서 사용하는 jquery 때문에.데이터테이블 플러그인 버전은 1.9.4입니다. 제가 자료를 찾을 때 찾은 설정 방법은 모두 1.10+입니다.orderable 속성을 가지고 jquery로 갑니다.datatable1.9.4 버전에서 한 바퀴 검색했는데 찾지 못해서 1.10.7 버전을 다운받았어요.
구 버전에서orderable에 대응하는 것은
bSortable, 1.10.x 1.9.x :
http://dt.thxopen.com/upgrade/1.10-convert.html
또한 Datatables 중국어 네트워킹:http://dt.thxopen.com/index.html