.js.erb 파일에 Jquery 데이터 테이블이있는 렌더링 템플릿

Question

현재 여러 보고서를 구현중인 프로젝트를 진행 중입니다. 보고서 필터는 원격으로 내 작업에 제출되고 반환 결과는 검색, 정렬 및 페이지 매김을 통해 Datatable에 표시됩니다.

var html = "<%= escape_javascript(render(partial: 'drg_datatable',formats: [:html],locals: {result: @result})) %>"; 
$("#datatable-result").append(html); 

부분 _drg_datatable.html.erb 이렇게 구현 된 데이터 테이블 구비되어

I는 다음과 같은 코드를 구비하는 drg.js.erb 파일을 갖는다. 다음은 내 _drg_datatable.html.erb 파일입니다

<% if result %> 
    <table id="results" class="table table-striped table-bordered display"> 
    <% case params[:view] %> 
    <% when "ahfs" %> 
     <%= datatable_ahfs_result(result) %> 
    <% when "drg_code" %> 
     <%= datatable_drg_result(result) %> 
    <% when "inpharmics_id" %> 
     <%= datatable_inpharmics_id_result(result) %> 
    <% when "provider" %> 
     <%= datatable_provider_result(result) %> 
    <% else %> 

    <% end %> 
    </table> 
<% end %> 

내가 직면하고 문제는 내가 .js.erb 파일을 사용하여 부분 _drg_datatable.html.erb을 렌더링 할 때 테이블을 만들지 만 추가하는 자바 스크립트를 탈출이다 sorting, pagination과 Jquery Datatables에서 얻을 수있는 멋진 기능들. 누군가 내가 이것을 어떻게해야하는지 가르쳐 줄 수 있습니까? 나는 escape_javascript를 쓰지 않고 부분을 .js.erb로 렌더링하려고 시도했지만 부분은 전혀 렌더링되지 않습니다.

Answer 1

@grotori : 해결책은 나에게 그것을 수정하는 힌트를주었습니다. 어디에서나 응용 프로그램에서 사용되지 않은 이름으로 데이터 테이블 ID의 이름을 바꿨습니다. 부분에서 데이터 테이블의 초기 구현을 제거하고 부분적으로 먼저 렌더링하고 데이터 테이블을 적용하는 코드를 수정했습니다. 여기 내가 한 일이 있습니다 :

var html = "<%= escape_javascript(render(partial: 'drg_datatable',formats: [:html],locals: {result: @result})) %>"; 
$("#datatable-result").html(html); 

jQuery(function() { 
    $("#drg-results").dataTable({ 
     "sDom": "<'row-fluid'<'span4'l><'span7 pull-right'f>r>t<'row-fluid'<'span4'i><'span7 pull-right'p>>", 
     "sPaginationType": "bootstrap", 
     "sScrollX": "100%", 
     "bDestroy": true, 
     "bProcessing": true, 
     "bScrollCollapse": true 
    }); 
}); 

희망은 다른 사람이 똑같은 것을 달성하는 데 도움이되기를 바랍니다.

Answer 2

drg.js.erb의 datatable js 함수를 명시 적으로 호출하여 테이블을 "datatablize"해야합니다. 예 :

$(document).ready(function(){ 
    $('a selector of yours').dataTable(); 
}); 

어딘가에 응용 프로그램의 자바 스크립트에서 :

var html = "<%= escape_javascript(render(partial: 'drg_datatable',formats: [:html],locals: {result: @result})) %>"; 
$("#datatable-result").append(html); 
$('#results').dataTable(); 

난 당신 같은 뭔가를 가정합니다. 이것은 문서가로드 된 후 한 번 실행되며 DOM에 존재하는 요소에 적용됩니다. 지금부터는 새로운 테이블을 추가하고 있습니다. 데이터 테이블의 동작을 "할당"해야합니다 ...