Different width for each columns in jspdf autotable?
You would have to transform your columnWidth array to look like this:
doc.autoTable({
html: '#table',
columnStyles: {
0: {cellWidth: 100},
1: {cellWidth: 80},
2: {cellWidth: 80},
// etc
}
});
Note the use of columnStyles
instead of styles
.
Let's say,[ steps,Methods,process,Delivers,Results ] are all my Table Headers.If i want to increase or decrease table width mean's ,
columnStyles: {
steps: {columnWidth:215},
Methods: {columnWidth: 60},
process: {columnWidth: 100},
Delivers: {columnWidth: 90},
Result: {columnWidth: 90}
}
Here you can specify the each column width.
By default the 'columnsStyles' dont have in 'Options', that's necessary create it and next step you define the 'columnWidth'.
Options['columnStyles'] = {
0: {columnWidth: 50},
1: {columnWidth: 'auto'},
2: {columnWidth: 'wrap'},
3: {columnWidth: 150}
}
JSPDF.autoTable(columns, values, Options)
In previous release (1.3.4) it could have done like below:
var columns = [
{title: "Signum", dataKey: "signum"},
{title: "Name", dataKey: "name"},
{title: "Role", dataKey: "role"},
{title: "Location", dataKey: "location"}
]
But the latest one i.e. 2.3.2 requires the below format
doc.autoTable(colums,data,{
addPageContent:pageContent,
margin: {horizontal:5,top: 20},
startY: 0.47*doc.internal.pageSize.height,
styles: {overflow: 'linebreak'},
columnStyles: {
id: {columnWidth: 25},
name:{columnWidth:40},
role: {columnWidth: 15},
location: {columnWidth: 30}
}
});
This will fix only id, name, role, and location to the specified limits. Rest other headers will be adjusted accordingly by autotable.js