0

I have a table:

<table id="example"  cellpadding="0" cellspacing="0" border="0" class="display" width="100%">
  <thead>
   <tr>
    <th>No</th>
    <th>Id</th>
    <th>Name</th>
    <th>Class</th>
   </tr>
  </thead>
  <tbody>
    <tr>
       <td>1</td><td>06.2010</td><td>Mike Adams</td><td>class 1</td>
    </tr>
    <tr>
       <td>2</td><td>06.2011</td><td>John Fox</td><td>class 2</td>
    </tr>
    <tr>
       <td>3</td><td>06.2012</td><td>Andrew Fisher</td><td>class 3</td>
    </tr>
  </tbody>
  <tfoot>
    <th>No</th>
    <th>ID</th>
    <th>Name</th>
    <th>Class</th>
  </tfoot>
 </table>

and i have making my table can view pdf in new tab from browser:

var doc = new jsPDF('p', 'pt', 'a4');
    var elem = document.getElementById("example");
    var res = doc.autoTableHtmlToJson(elem);
    doc.autoTable(res.columns, res.data, {
        startY: 60,
        styles: {
          overflow: 'linebreak',
          fontSize: 8,
          columnWidth: 'wrap'
        },
        columnStyles: {
          1: {columnWidth: 'auto'}
        }
      });
    doc.output('dataurlnewwindow');

From my table I want eliminate front column (No), and remove last row (foot table) in pdf.
but I don't know how to eliminate it.

4

1 回答 1

3

为了删除前列(否)和最后一行(脚表),您可以使用

第一步可以是克隆表。第二步是删除页脚。而第三步是删除第一列。

所以,新代码是:

$(function () {
  var doc = new jsPDF('p', 'pt', 'a4');

  var tbl = $('#example').clone();
  tbl.find('tfoot').remove();
  
  /********
    1 -->  No
    2 -->  Id
    3 -->  Name
    4 -->  Class
  *****/
  tbl.find('tr th:nth-child(1), tr td:nth-child(1)').remove();

  var res = doc.autoTableHtmlToJson(tbl.get(0));


  doc.autoTable(res.columns, res.data, {
    startY: 60,
    styles: {
      overflow: 'linebreak',
      fontSize: 8,
      columnWidth: 'wrap'
    },
    columnStyles: {
      1: {columnWidth: 'auto'}
    },
    createdCell: function (cell, data) {
      var a = this;
    }
  });
  doc.output('dataurlnewwindow');
});
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://rawgit.com/MrRio/jsPDF/master/dist/jspdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/2.0.16/jspdf.plugin.autotable.js"></script>


<table id="example" cellpadding="0" cellspacing="0" border="0" class="display" width="100%">
    <thead>
    <tr>
        <th>No</th>
        <th>Id</th>
        <th>Name</th>
        <th>Class</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>1</td>
        <td>06.2010</td>
        <td>Mike Adams</td>
        <td>class 1</td>
    </tr>
    <tr>
        <td>2</td>
        <td>06.2011</td>
        <td>John Fox</td>
        <td>class 2</td>
    </tr>
    <tr>
        <td>3</td>
        <td>06.2012</td>
        <td>Andrew Fisher</td>
        <td>class 3</td>
    </tr>
    </tbody>
    <tfoot>
    <th>No</th>
    <th>ID</th>
    <th>Name</th>
    <th>Class</th>
    </tfoot>
</table>

于 2016-08-24T10:58:31.223 回答