동적으로 생성 된 html 테이블에 페이지 매김 추가

Question

동적으로 생성 된 html에 페이지 매김을 추가하려고합니다. Default.aspx 페이지에서이 스크립트를 추가했습니다.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"> </script> 
<script type ="text/javascript" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> 
<link rel ="stylesheet" type=" text/css" href=" https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" /> 

<div id = resultDiv></div> 

표가이 div에 나타납니다. 테이블은

내 JS 파일이

$.ajax({ 
      url: 'cannot mention', 
      method: 'get', 
      data: requestData, 
      dataType: 'json', 
      success: function (data) { 
       var ordersArray = data.orders; 
       var i; 
       var k; 
       var quantityArray; 

       var out = "<legend class='bluefont'><b><span id='info'>FOD</span></b></legend>" 
       out += "<table id ='tableresult' border='2px' style='font-size: 8pt '>"; 

       out += "<tr><th> Order Date</th>"; 

       for (i = 0; i < ordersArray.length; i++) { 
        out += "<td>" + ordersArray[i].orderDate + "</td>"; 
       } 
       out += "</tr>"; 
       out += "<tr><th>Delivery Date</th>"; 

       for (i = 0; i < ordersArray.length; i++) { 
        out += "<td>" + ordersArray[i].deliveryDate + "</td>"; 
       } 
       out += "</tr>"; 
       out += "<tr><th>Quantity</th>"; 

       for (i = 0; i < ordersArray.length; i++) { 
        quantityArray = ordersArray[i].order 

        for (k = 0; k < quantityArray.length ; k++){ 
        out += "<td>" + quantityArray[k].quantity + "</td>"; 
        } 
       } 
       out += "</tr>"; 
       out += "</table>"; 

       document.getElementById("resultDiv").innerHTML = out; 
       document.getElementById("tableresult").dataTable 

과 같은 웹 서비스에서 JSON 응답을 얻은 후 동적으로 생성되고이 데이터 테이블은 함수가 아닙니다 말한다. 제발 도와주세요

Answer 1

jQuery 개체를 jQuery DataTables를 초기화해야합니다. 예 :

$('#tableresult').DataTable();