jQuery Mobile에서 테이블을 동적으로 생성하십시오.

Question

JQM에서 html 파일로 테이블 플러그인을 생성하고 있습니다. 그것은 제대로

HTML 페이지

<table data-role="table" data-mode="columntoggle" class="ui-responsive table" id="service"> 
.... 
</table> 

작동하지만 난 동적으로 테이블을 만들려고합니다. 이럴 때. JQM 기본 플러그인은

가

내 코드는 HTML 페이지에

var service_table = $('<table data-role="table" data-mode="columntoggle" class="ui-responsive table" id="service"></table>') 


      var service_tr_th = $("<tr><th>Name</th></tr>"); 
     var service_tr=$('<tr></tr>'); 
     var service_name_td=$('<td>'+retServiceName+'</td>'); 
     $(service_name_td).appendTo(service_tr); 
     $(service_tr_th).appendTo("#categories"); 
     $(service_tr).appendTo(service_table); 
     $(service_table).appendTo("#categories"); 

입니다 적용되지

<div id="categories"></div> 

Answer 1

열 토글 테이블을 만들 때 (헤더 세포에 THEAD 및 TBODY, 그리고 data-priority="x"를 추가

http://demos.jquerymobile.com/1.4.2/table-column-toggle/ 참조). 마지막으로 테이블을 강화하기 위해 JQM에게하는 .table() 메소드를 호출 여기

var service_table = $('<table data-role="table" data-mode="columntoggle" class="ui-responsive table-stroke" id="service"></table>'); 


var service_tr_th = $("<thead><tr><th data-priority='1'>Name</th><th>Col2</th data-priority='2'></tr></thead>"); 
var service_tbody = $('<tbody></tbody>'); 
var service_tr = $('<tr></tr>'); 
var service_name_td = $('<td>' + retServiceName + '</td><td></td>'); 
service_name_td.appendTo(service_tr); 
service_tr_th.appendTo(service_table); 
service_tr.appendTo(service_tbody); 
service_tbody.appendTo(service_table); 
service_table.appendTo($("#categories")); 

service_table.table(); 

것은 DEMO

참고는 다음과 같습니다 당신은 변수 약 $()를 필요로하지 않습니다 이미 jQuery 컬렉션 service_tr, service_name_td 등