excelhtml5 is not exporting data of html table having th tag with id element
excelhtml5 is not exporting data of html table having th tag with id element
Bmkotkar
Posts: 5Questions: 1Answers: 0
DataTable export:-
{"extend":"excelHtml5", "text":'<i class="far fa-fw fa-file-excel"></i> Spreadsheet',"titleAttr":"Create an Excel file", "exportOptions": {"orthogonal":'export', "columns":[":not('.noExport')"]}, "title":serviceContext.orgName+" Students in Session Export", "autoFilter": true, "sheetName":"Exported data" },
HTML table:-
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Grade</th>
<th id="username">Username</th>
<th id="password">Password</th>
<th>Scores</th>
<th>Notes</th>
</tr>
</thead>
Error:-
datatables.min.js:71 Uncaught TypeError: Cannot read properties of undefined (reading 'length')
at datatables.min.js:71:21536
at X.action (datatables.min.js:71:21851)
at r (datatables.min.js:51:6771)
at datatables.min.js:51:6949
Description of the problem:-
if Html table has id element in it then excel spreadsheet export option throws above error. however for rest of the options like csv and pdf it works fine.
Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide
This question has an accepted answers - jump to answer
Answers
I'm not sure how the HTML table having an
idwould affect the Excel export. I put your code snippet works in this test case with the HTML table having anid:https://live.datatables.net/tuwuquko/1/edit
Please provide a link to your page or a test case replicating the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
Its not table having id., issue is <th> table header having id is causing an issue.
Please find below link for live example:
https://jsbin.com/ganicehiju/edit?html,js,output
<th id="username">Username</th>
<th id="password">Password</th>
above fields are causing issues.
Bhagyashree.
Your example doesn't appear to run? Even if I add the DataTables / Buttons libraries:
It still doesn't run with the error:
Here is a trivial example with two header cells which have
idattributes and Excel export works without issue.Perhaps you can update your example to run and demonstrate the issue you are having so I can attempt to debug it.
Allan
Actually Allan.,
What I have used is just a snippet taken from the big fat project., and hence it has many dependent things.
Sorry for inconvenience.
Actually this columns are getting collapsed while datatable rendering
<th id="username">Username</th>
<th id="password">Password</th>
and hence they are not accessible in excel export
That's no problem. If you could provide a minimal example demonstrating the issue I'd be happy to take a look into the problem. You could use the one I provided as a starting point.
Allan
Allan,
I couldn't get the working solution for you to debug.,
however there is one thing which we are doing is based upon id provided in <th> tag, we are updating this <th> headername using jquery and after that this header name is passed as undefined.
below are the lines where we are updating those headernames
$("#username",dt.table().header()).text('Access Code')
$("#password",dt.table().header()).text('Test ID')
and after this updation, this headers are passed/working as a undefined
With those two lines added I get an error: https://live.datatables.net/hogimeqe/4/edit .
I would suggest using
column().title()to set a column's title. The problem with writing in your own content is that it is removing the elements that DataTables is putting in and using. You'll notice for example that the sort icons have been removed from those header cells.If you must manipulate the HTML without using the API, then write into the
span.dt-column-titleelements: https://live.datatables.net/cuzowaha/1/edit .Allan
Thank you so much Allan.
This solution has resolved my issue.