Adding DataTables to a site that already had jQuery and Bootstrap

ScottPendleton · April 2017

I created a sample page and included the datatables.js file as directed. I also tried including or not including jQuery. Worked the same either way. Yet I couldn't find in datatables.js that it somehow magically imported jQuery. Is the entire jQuery library contained in datatables.js?

The reason I wonder is that i tried to add datatables to a project that already uses jQuery and Bootstrap. That broke a plug-in for a listbox with checkboxes next to the list items. So I'm just trying to get a handle on things. I used the datatables builder to include a whole ton of extensions, such as ability to export to Excel. But those won't work unless specifically included, right?

tangerine · April 2017

Is the entire jQuery library contained in datatables.js?

No.

The simplest approach here would be to provide your HTML code, showing how you are incorporating the necessary js references.

ScottPendleton · April 2017

<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Tables</title>
<link rel="stylesheet" type="text/css" href="datatables.css" />
</head>
<body>
<table id="table_id" class="display">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Fred</td>
            <td>Mary</td>
        </tr>
        <tr>
            <td>John</td>
            <td>Helen</td>
        </tr>
    </tbody>
</table>

</body>
<% ' Commented out: <script type='text/javascript' charset="utf8" src="jQuery-2.2.4/jQuery-2.2.4.js"></script>  %>
<script type='text/javascript' charset="utf8" src="datatables.js"></script>
<script type='text/javascript' charset="utf8">
    $(document).ready(function () {
        $('#table_id').DataTable();
    });
</script>
</html>

tangerine · April 2017

<% ' Commented out: <script type='text/javascript' charset="utf8" src="jQuery-2.2.4/jQuery-2.2.4.js"></script>  %>

What is that? DataTables requires jQuery.

ScottPendleton · May 2017

As I said, DataTables seems to work whether or not jQuery is included.

kthorngren · May 2017

Using the downlaod builder you can include jQuery. Maybe the jQuery version included is not compatible with your other plugins or if you are loading it twice you likely will have problems. Maybe try the download builder again and don't include jQuery but include the Bootstrap styling files, Datatables and the extensions you want.

I'm not sure if the third party (JSZip, for example) files needed for the export buttons are included but you can add them manually if needed.

Kevin

allan · May 2017

Exactly as Kevin says. If you have selected the jQuery option in the download builder, then yes, it will include jQuery. The way to check what is being included is to open the datatables.js file in a text editor. At the top it will say what is being included.

Allan

Adding DataTables to a site that already had jQuery and Bootstrap

Adding DataTables to a site that already had jQuery and Bootstrap

Answers

Howdy, Stranger!

Categories

DataTables

Adding DataTables to a site that already had jQuery and Bootstrap

Adding DataTables to a site that already had jQuery and Bootstrap

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables