Francisunoxx Francisunoxx - 1 year ago 90
jQuery Question

Getting the values from textfield to save as PDF

I already can retrieve every values on my cell depending on what the user input. Using this.

$("#customFields > tbody tr > td").each(function()

But I'm just having a little problem on how can I append user input in the textfield? Becasue when I save as a pdf I got a crumpled
<input type="text" class="form-control">
in one cell and it's not getting the values that I input. Screenshot below.



Is there a way how can I input that values that I inserted here in every cell? I'm stuck in this part I need opinion from others how can I do this.


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

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

<th>Stock No.</th>

<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>


<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>


$("#customFields > tbody tr > td").each(function() {

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();

// 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;



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);

$.each(table, function(i, row) {
$.each(row, function(j, cell) {
doc.cell(1, 10, 90, 20, cell, i);

javascript: genPDF();

Answer Source

Replace your source code to:

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

This is my test enter image description here

Hope this can help you. xD

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download