2014-11-14 4 views
1

몇 가지 (더 나은) 방법이 있지만 작업을 수행 할 수는 없습니다. 단추를 클릭 할 때 datatables (다른 데이터 원본에서) 새 데이터를로드하려면 노력하고있어.버튼을 클릭 한 후 데이터 테이블을 다시로드하십시오.

여기에 내가 가진 무엇 :

$(document).ready(function() { 

    $('#datatable2').dataTable({ 

    "ajax": { 
     "url":"simple4.php", 
     "type":"GET" 
    } , 

    "paging":  true, 
    "pageLength": 20, 
    "order": [[ 2, "asc" ]], 
    "aoColumns": [ 
     { "bSortable": false, "width": "25%" }, 
     { "bSortable": true, "width": "30%" }, 
     { "bSortable": true, "width": "15%" }, 
     { "bSortable": true, "width": "15%" }, 

     { "bSortable": true, "width": "15%" }, 
     { "bSortable": false, "width": "0%", "visible":false }, 

    ], 
    }); 

    $("#option2").click(function() { 
    table.ajax.url('simple3.php').load(); 
    }); 
}); 

초기 테이블 (simple4.php에서)로드 잘. 버튼을 클릭하면 (id = option2의 경우) 버튼을 클릭하면 변경되지만 버튼을 클릭하면 아무 것도 나타나지 않습니다. 문제가 무엇인지

<label class="btn btn-default"> 
<input type="radio" name="options" id="option2" value="1" autocomplete="off"> Compare 1 and 2 
</label> 

확실하지 :

이런 경우에, 여기에 내가 뭔가를 분명 누락 경우 버튼 코드입니다. 모든 통찰력이 도움이 될 것입니다.

업데이트 : 아래 문제에 대한 설명을 참조하십시오. 분명히 중요한 차이점이있는 한 가지 일은 "DataTable"대 "DataTable"을 사용하는 것입니다. 당신은 자본 D 및 자본 T. 여기 지금 일하고있어 고정 코드의 필요 :

$(document).ready(function() { 
var table = $("#datatable2").DataTable({ 

    "ajax": { 
    "url":"simple3.php", 
    "type":"GET" 
} , 

    "paging":  true, 
    "pageLength": 20, 
"order": [[ 2, "asc" ]], 
    "aoColumns": [ 
    { "bSortable": false, "width": "25%" }, 
    { "bSortable": true, "width": "30%" }, 
{ "bSortable": true, "width": "15%" }, 
    { "bSortable": true, "width": "15%" }, 

    { "bSortable": true, "width": "15%" }, 
    { "bSortable": false, "width": "0%", "visible":false }, 

    ], 

}); 
$("#option2").click(function() { 
table.ajax.url("simple4.php").load(); 
}); 
}); 

한가지 더 ... 내 라디오 버튼이 작동하지 않는 클릭 할 때 발생했는데 내 기능. 이에

$("#option2").click(function() { 
table.ajax.url("simple4.php").load(); 
}); 

:이로 변경했다

$('input[id=option2]').change(function(){ 
table.ajax.url("simple4.php").load(); 
}); 
+0

콘솔에 오류가 있습니까? 콜백 변수'table'은 정의되어 있지 않습니다. – MamaWalter

답변

2

먼저 다른 변수는 'table'변수가 설정되지 않았다고 말했기 때문입니다.

둘째,

var table = $('#datatable2').dataTable({.....}) 

당신은

는 DataTables의 API 인스턴스를 얻을 수있는 DataTables의 API 중 하나에 액세스 할 수 없습니다 JQuery와 객체를 반환하는 전화를 할 때 전화를 걸 필요 like :

var table = $('#datatable2').DataTable({....}); 

URL에 의해 반환 된 데이터가 올바르게 구성되었다고 가정하면 작동합니다.

출처 : https://datatables.net/faqs/#api

2

지금이 시도 할 수없는,하지만 난 그것을 먹힐 생각 :

var table = $('#datatable2').dataTable({...}); 

$("#option2").click(function() { 
    table.ajax.url('simple3.php').load(); 
}); 

당신이 VAR 설정되지 않습니다 table = ... 그래서 table.ajax를 호출 할 때 ... 테이블 var가 존재하지 않습니다.

관련 문제