數據表按鈕pdfHtml5 exportOptions刪除嵌套標籤

-1

我想優化頁面的數據表按鈕pdfHtml5出口。表格數據包含嵌套的html標籤，它們在單元格數據的上方和下方創建額外的空間，這使得PDF非常長。數據表按鈕pdfHtml5 exportOptions刪除嵌套標籤

在我的單元格的文本被包裹在兩個嵌套<div>和<p>。在PDF導出，我只需要的<p>

<td> 
    <div class="flagimg" style="background-image: url(...)"> 
    <div class="flagtext"> 
     <p>name of country</p> 
    </div> 
    </div> 
</td>

我試圖刪除使用exportOptions嵌套html標籤的內容，但我不知道如何正確地寫出語法。誰能幫我這個？

$(document).ready(function() { 
    var buttonCommon = { 
    exportOptions: { 
     format: { 
     body: function(data, column, row) { 
      data = data.replace(/<div class="flagtext"\">/, ''); 
      data = data.replace(/<.*?>/g, ""); 
      return data; 
     } 
     } 
    } 
    }; 
    var oTable = $('#example').DataTable({ 
    dom: 'Bfrtip', 
    buttons: [ 
     $.extend(true, {}, buttonCommon, { 
      extend: 'copyHtml5' 
     }), 
     $.extend(true, {}, buttonCommon, { 
      extend: 'excelHtml5' 
     }), 
     $.extend(true, {}, buttonCommon, { 
      extend: 'pdfHtml5' 
     }) 
    ] 
    }); 
})

來源

2016-07-28 lbriquet

我終於發現，這個問題是不是在所有的嵌套div 而是這些代碼的代碼的縮進而不是在一行上。我已經向Datatables報告了這一點，我在這裏記錄了這個問題，以防其他人遇到它。

我已經建立了上作出說明發生了什麼小提琴@davidkonrad。
https://jsfiddle.net/lbriquet/7f08n0qa/

在第一行中，嵌套的標籤代碼縮進......這會產生上面和下面的PDF出口國名數據的額外空間。

在第二行中，我已經把所有的標籤在同一行的代碼......也沒有多餘的間距在PDF導出生產。

<table id="example" width="100%" border="0" cellspacing="0" cellpadding="0" > 
    <thead> 
    <tr> 
     <th>Name</th> 
     <th>Position</th> 
     <th>Office</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td> 
     <div class="myclass"><a href="#">Company name</a> 
     </div> 
     </td> 
     <td> 
     <div class="flagimg" style="background-image: url(#"> 
      <div class="flagtext"> 
      <p>Country name</p> 
      </div> 
     </div> 
     </td> 
     <td> 
     <div class="myclass">Product sold</div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     <div class="myclass"><a href="#">Company name</a> 
     </div> 
     </td> 
     <td><div class="flagimg" style="background-image: url(#)"><div class="flagtext"><p>Country name</p></div></div> 
     </td> 
     <td> 
     <div class="myclass">Product sold</div> 
     </td> 
    </tr> 
    </tbody> 
</table>

來源

2016-07-29 11:31:59 lbriquet

數據表按鈕pdfHtml5 exportOptions刪除嵌套標籤

回答

相關問題