DataTables CDN not working

DataTables CDN not working

yousufsadatyousufsadat Posts: 25Questions: 11Answers: 0
edited June 2017 in Free community support

Hi. I am using DataTables CDN and seems like the table is not getting the features like pagination or sorting. I've included the JQuery CDN though.

My code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.15/js/jquery.dataTables.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.15/css/jquery.dataTables.css"> 

My Table

<table id="table_id" class="display">
        <thead>
            <tr>
                <th>Line of Business</th>
                <th>Insured</th>
                <th>Insured</th>
                <th>Customer Phone</th>
                <th>Policy #</th>
                <th>E-Sign Created Date</th>
                <th>Customer Email</th>
                <th># of E-Sign Documents</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Row 1 Data 1</td>
                <td>Row 1 Data 2</td>
            </tr>
            <tr>
                <td>Row 2 Data 1</td>
                <td>Row 2 Data 2</td>
            </tr>
        </tbody>
    </table>

JQuery

 $(document).ready( function () {
            $('#table_id').DataTable();
        } );

Edited by Allan

Answers

  • kthorngrenkthorngren Posts: 20,275Questions: 26Answers: 4,765

    table is not getting the features

    Either you aren't loading all the necessary JS and CSS files (based on the above code you are not) or you are getting an error causing the page load to stop. You can look at the browser's console for errors.

    This page explains what files are needed:
    https://datatables.net/manual/installation

    A good way yo go is to use the download builder to select everything you need.

    Kevin

  • allanallan Posts: 61,665Questions: 1Answers: 10,096 Site admin

    Kevin won't have seen this since you didn't use Markdown syntax highlighting (which I've now added), but your header defines 8 columns. But your table body only has two. They need to match.

    The CDN is working just fine at the moment :)

    Allan

  • yousufsadatyousufsadat Posts: 25Questions: 11Answers: 0
    edited June 2017

    Allan, my bad. You are absolutely correct. It is working perfectly fine but I am facing another issue. DataTables doesn't show me the data if I use the below syntax using Expression Language. I got all the taglibs in place. Please advise me what should I do. I really need this working.

    <table id="table_id" class="display">
      <thead>
            <tr>
                  <th>Line of Business</th>
                  <th>Customer Phone</th>
                  <th>Customer Email</th>
            </tr>
      </thead>
      <tbody>
            <tr>
                  <c:forEach items="${intgList}" var="list">
                              <td><c:out value="${list.lob}"/></td>
                        </c:forEach>     
            </tr>
      </tbody>
      </table>
    

    Edited by Allan - Syntax highlighting

  • allanallan Posts: 61,665Questions: 1Answers: 10,096 Site admin

    What does the generated HTML look like? i.e do a view source.

    Allan

  • yousufsadatyousufsadat Posts: 25Questions: 11Answers: 0

    Allan. It is working now after I cleared the browser cache. Thanks Allan for your support.

This discussion has been closed.