从文本字段获取值以另存为 PDF

Question

我已经可以根据用户输入的内容检索单元格中的每个值。使用这个。

$("#customFields > tbody tr > td").each(function() 
{
 console.log($(this).find("input").val());
});

但我对如何在文本字段中追加用户输入有一个小问题？因为当我另存为 pdf 时，我在一个单元格中得到了一个皱巴巴的 <input type="text" class="form-control">，它没有得到我输入的值。截图如下。

截图：

有没有办法将我在此处插入的值输入到每个单元格中？我卡在这部分我需要其他人的意见我该怎么做。

Table:

<div class = "col-md-12">

    <table class = "table" id = "customFields">

        <thead>
            <tr>
                <th>Stock No.</th>
                <th>Unit</th>
                <th>Description</th>
                <th>Quantity</th>
            </tr>
        </thead>

        <tbody>
            <tr>
                <td><input type="text" class="form-control"></td>
                <td><input type="text" class="form-control"></td>
                <td><input type="text" class="form-control"></td>
                <td><input type="text" class="form-control"></td>
            </tr>
        </tbody>

    </table>

    <button type = "submit" class = "btn btn-primary" id = "addMore">+ Add</button>
    <button type = "submit" class = "btn btn-danger" id = "removeRow">- Remove</button>
    <button type = "submit" class = "btn btn-primary" id = "save">Save</button>
</div>

脚本：

  $("#customFields > tbody tr > td").each(function() {
    console.log($(this).find("input").val());
  });

  function tableToJson(table) {

    var data = [];

    // first row needs to be headers
    var headers = [];

    for (var i = 0; i < table.rows[0].cells.length; i++) {
      headers[i] = table.rows[0].cells[i].innerHTML.replace();
    }

    data.push(headers);
    // go through cells
    for (var i = 1; i < table.rows.length; i++) {

      var tableRow = table.rows[i];
      var rowData = {};

      for (var j = 0; j < tableRow.cells.length; j++) {

        rowData[headers[j]] = tableRow.cells[j].innerHTML;

      }

      data.push(rowData);
    }

    return data;
  }

  function genPDF() {
    //tableToJson is a special function which converts HTML object to Javascript Object Notation

    var table = tableToJson($('#customFields').get(0));

    //Defining pdf object
    var doc = new jsPDF('1', 'pt', 'letter', true);

    doc.cellInitialize();
    $.each(table, function(i, row) {
      $.each(row, function(j, cell) {
        doc.cell(1, 10, 90, 20, cell, i);
      });
    });
    doc.save('text.pdf');
  }

  javascript: genPDF();

Answer 1

将您的源代码替换为：

for (var j = 0; j < tableRow.cells.length; j++) {
    rowData[headers[j]] = tableRow.cells[j].children[0].value;
    alert(rowData[headers[j]]);
}

这是我的测试

希望对您有所帮助。 xD

从文本字段获取值以另存为 PDF

Getting the values from textfield to save as PDF

javascript

php

pdf

jquery

jspdf