Removing "nowrap" did not work with V2.2.1
Removing "nowrap" did not work with V2.2.1
rfertig
Posts: 3Questions: 1Answers: 0
Description of problem: As mentioned in Default Styling Options, you can add the CSS class nowrap to the table element to prevent the table content from being split into multiple rows. I've been doing this for years with JQuery:
$('table.dataTable').toggleClass("nowrap");
Now I've moved from DataTables 1.14.1 to 2.2.1. Adding nowrap still works, but if nowrap is removed, nothing happens - even if I do a draw().
What can I do?
René
This question has an accepted answers - jump to answer
Answers
The
nowrapclass seems to work as expected in this test case:https://live.datatables.net/nagiwivo/1/edit
I added a button to execute the code snippet you provided and that seems to work as well.
The first table has
nowrapapplied and the second doesn't. Can you provide a test case showing thw issue so we can help debug?https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
Thanks, Kevin.
I modified your test case to apply my initialization of DataTable and this way I found out that the
scrollXis causing the problem, see: https://live.datatables.net/damaxuji/1/editI don't know why the problem arises, but since I can omit this option, the case is solved for me.
René
Thanks. I'm not sure how to fix this as it doesn't seem
columns.adjust()works either. As you mentioned forcing a Datatable draw doesn't work either. However I did notice if the container size changes then the table display changes. For example close the HTML tab of your test case. Not sure if there is a Javascript method that can be executed to refresh the page display after the toggleClass. @allan might have suggestions.Kevin
Once a table has the
nowrapclass added it is quite difficult to remove it because the long lines are forcing the width.Removing
nowrapdoesn't work because the column widths have been set to match between the header and body (to ensure column alignment).columns.adjust()doesn't work because it draws the table at 100% width in the container, and the container is already stretched by the nowrap content.The column width calculations have changed in DataTables, which is the cause of the difference between 1.x and 2.x (in fact even since 2.0 and 2.1 I think this might have changed a little).
Glad to hear that you can just drop
scrollXto get the effect you want though.Allan