No borders
No borders
Jochen
Posts: 5Questions: 3Answers: 0
Beginner alert! Bear with any obvious stupidity in the following.
I am trying to use DataTables in an HTML table. The table is using the cell-border class. Nevertheless, there are no borders rendered.
Any ideas, what might be wrong?
P.S: And, any suggestions on a better solution for the alignment of the header columns would be welcome, too.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Registered logging components</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"></link>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script type="text/javascript" language="javascript"
src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"> </script>
<script>
$( function() {
$('#component-table').DataTable({"ajax": "../../rest/wx/log4j2/ws/component",
"columns": [
{ "data": "id" },
{ "data": "description" },
{ "data": "version" },
{ "data": "level" },
{ "data": "file" }
]
});
} );
</script>
</head>
<body>
<h1>Registered logging components</h1>
<table id="component-table" class="cell-border" style="width:100%">
<thead>
<tr>
<th align="left">Id</th>
<th align="left">Description</th>
<th align="left">Version</th>
<th align="left">Level</th>
<th align="left">File</th>
</tr>
</thead>
</table>
</body>
</html>
This discussion has been closed.
Answers
It's working as expected here. Could you look at that, please, and see if it helps. If it's still not working for you, please can you update my example, or link to your page, so that we can see the problem.
Cheers,
Colin
Doesn't look like you are loading the datatables.css include file. You can see it in Colin's example and this example. Look at the
CSStab. Use the Download Builder to get all the correct files for the styling and extensions you want to use.More information on styling is here.
Kevin