버튼에 의해 트리거되는 3 개의 전환 가능한 서버 측 테이블이있는 페이지를 만들고 버튼 스위치가 작동합니다 (페이지를 새로 고치고 첫 번째 버튼을 클릭하면 테이블이 표시되지만 다른 버튼을 클릭하면 오류 창이 데이터 테이블을 다시 초기화 할 수 없음을 알려줍니다). 첫 번째 초기화 된 테이블을 지우지 만 작동하지 않는 함수.
여기 내 페이지입니다
<div class="panel-body">
<div class ="row">
<div class ="text-center alert col-md-12">
<a class="btn btn-primary" href="#table_assall" data-toggle="tab">All Assets List</a>
<a class="btn btn-primary" href="#table_asborrow" data-toggle="tab">Used Assets</a>
<a class="btn btn-primary" href="#table_asbroken" data-toggle="tab">Damaged Assets</a>
</div>
</div>
<div class="tab-content">
<div id="table_assall" class="tab-pane fade active in">
<div class="table-responsive">
<table class="display" width="100%" cellspacing="0" id="">
*thead source code*
</table>
</div>
</div>
<div id="table_asborrow" class="tab-pane fade">
<div class="table-responsive">
<table class="display" width="100%" cellspacing="0" id="">
*thead source code*
</table>
</div>
</div>
<div id="table_asbroken" class="tab-pane fade">
<div class="table-responsive">
<table class="display" width="100%" cellspacing="0" id="">
*thead source code*
</table>
</div>
</div>
</div>
-서버 측 테이블을 트리거하는 JS 파일
var _ajaxURL = "tableresponses.php"; //you can initialize this global variable with some default value.
$('.changeTable').on('click', function() {
_ajaxURL = $(this).attr('data-ajax');
$('table.display').DataTable({
lengthChange: true,
info: false,
fixedHeader: true,
select: true,
"bAutoWidth": false,
"bProcessing": true,
"serverSide": true,
"ajax": {
url: _ajaxURL, // json datasource
type: "post", // type of method , by default would be get
error: function() { // error handling code
$("#astab_processing").css("display", "none");
}
}
});
function testUpdatedDatatable() {
$('table.display').DataTable().clear().rows.add(response._ajaxURL).draw();
console.log('#running');
}
});
초기화 코드에 인수를 1 개 더 추가하십시오.
$('table.display').DataTable({
lengthChange: true,
info: false,
fixedHeader: true,
select: true,
"bAutoWidth": false,
"bProcessing": true,
"serverSide": true,
"destroy": true,
"ajax": {
url: _ajaxURL, // json datasource
type: "post", // type of method , by default would be get
error: function() { // error handling code
$("#astab_processing").css("display", "none");
}
}
});
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다