jQuery plugin to serialize HTML tables into javascript objects.
It is recommended to pull this tool into your project directly. But if you insist to use a CDN, here is one:
<script src="https://cdn.jsdelivr.net/npm/table-to-json@1.0.0/lib/jquery.tabletojson.min.js" integrity="sha256-H8xrCe0tZFi/C2CgxkmiGksqVaxhW0PFcUKZJZo1yNU=" crossorigin="anonymous"></script>
data-override="overridden column name"
th
and td
tagsdata-override="new value"
rowspan
and colspan
ignoreColumns
[]
onlyColumns
ignoreColumns
when provided.null
- all columnsignoreHiddenRows
true
ignoreEmptyRows
false
headings
<tr>
null
allowHTML
false
includeRowId
boolean
or a string
. If true
, the the id
attribute on the table's <tr>
elements will be included in the JSON as rowId
. To override the name rowId
, supply a string of the name you would like to use.false
textDataOverride
textExtractor
extractor
extractor
data-override
will prevent this function from being called. Example:$('table').tableToJSON({
extractor : function(cellIndex, $cell) {
// get text from the span inside table cells;
// if empty or non-existant, get the cell text
return $cell.find('span').text() || $cell.text();
}
});
$('table').tableToJSON({
extractor : function(cellIndex, $cell) {
return {
name: $cell.find('span').text(),
avatar: $cell.find('img').attr('src')
};
}
});
colspan
cells into account!) of the table; a value in data-override
will prevent this function from being called. Example:$('table').tableToJSON({
extractor : {
0 : function(cellIndex, $cell) {
return $cell.find('em').text();
},
1 : function(cellIndex, $cell) {
return $cell.find('span').text();
}
}
});
null
<table id='example-table'>
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th data-override="Score">Points</th></tr>
</thead>
<tbody>
<tr>
<td>Jill</td>
<td>Smith</td>
<td data-override="disqualified">50</td></tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td></tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td></tr>
<tr>
<td>Adam</td>
<td>Johnson</td>
<td>67</td></tr>
</tbody>
</table>
<script type="text/javascript">
// Basic Usage
var table = $('#example-table').tableToJSON();
// table == [{"First Name"=>"Jill", "Last Name"=>"Smith", "Score"=>"disqualified"},
// {"First Name"=>"Eve", "Last Name"=>"Jackson", "Score"=>"94"},
// {"First Name"=>"John", "Last Name"=>"Doe", "Score"=>"80"},
// {"First Name"=>"Adam", "Last Name"=>"Johnson", "Score"=>"67"}]
// Ignore first column (name)
var table = $('#example-table').tableToJSON({
ignoreColumns: [0]
});
// table == [{"Last Name"=>"Smith", "Score"=>"disqualified"},
// {"Last Name"=>"Jackson", "Score"=>"94"},
// {"Last Name"=>"Doe", "Score"=>"80"},
// {"Last Name"=>"Johnson", "Score"=>"67"}]
</script>
npm
package manager.npm install
from app root directory.
package.json
for a full list.npm install -g grunt-cli
.grunt
to run tests and create a new build in /lib
.develop
branch.Colin Tremblay is working on a PHP implementation at HTML-Table-To-JSON
allowHTML
option and various other changes.headings
option.rowspan
& colspan
support. Also adding the textExtractor
& dataOverride
feature!includeRowId
support.ignoreEmptyRows
option.rowspan
& colspan
bug.extractor
feature!ignoreEmptyRows
and ignoreColumns
options