bootstrap3 styling doesn't work properly
bootstrap3 styling doesn't work properly
badbyte
Posts: 33Questions: 7Answers: 0
I'm trying to give the datatable a look and feel of bootstrap and there is a section on this site that demonstrates how it is done: https://datatables.net/examples/styling/bootstrap.html
The instructions are very clear and easy to understand. I have made the changes and added the necessary files as requested.
Yet I get this:
Please let me know if I need to post any code when necessary.
This discussion has been closed.
Replies
Looks like you have the Bootstrap style sorting arrows and the Datatables style sorting arrows. This suggests you have extra Datatables styling files. The easiest way to get the proper files is to use the Download Builder
Kevin
I would agree, but just out of curiosity where would I change the path of the fonts?
And when I use the download builder, what do I need to check?
What fonts? DataTables doesn't use any specific fonts.
When you use the download builder, at the bottom of the page it shows you the files you need to include.
My guess is that you've also got the table hidden when it is initialised (perhaps in a tab?), although without a test case it is impossible to say for sure. You need to call
columns.adjust()when the table is made visible.Allan
@allan: yes that is true I have it under a separate tab. what is it that I have to consider in this case?
Have a look at this example for details.
Allan
ok, that solved the column width definition, but the icons / symbols for sorting according to a column is not completely rendered.
The search box doesn't have the bootstrap look&feel
I'm guessing that you haven't included the Bootstrap / DataTables integration file. Use the download builder.
Beyond that, I'd need a link to a test case.
Allan
bootstrap is already included, but not from the download builder. That could come into conflict if I added another bootstrap to my solution, or?
You'd only add Bootstrap once. Don't select the option to include the whole Bootstrap library if you already have Bootstrap. Just select the Bootstrap styling.
Allan