Perhaps I don't have the syntax correct.....

Perhaps I don't have the syntax correct.....

gmarshall56gmarshall56 Posts: 15Questions: 6Answers: 0

In my jsp page I use Struts tags to point to the the 1.10.2 version of jquery:

<c:url var="jqueryLatest" value="/static/javascript/jquery-1.10.2.min.js" />

.... and I do the same pointing the 1.10 version of dataTables:
<c:url var="dataTableJs" value="/static/javascript/jquery.dataTables.js" />

In that same jsp page I have a html table defined like this:

    <table id="revTable">
        <thead>
            <tr>
                <th>Revision Number</th>
                <th>Saved By</th>
                <th>Timestamp</th>
                <th>Comment</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>

In my javascript file I establish a dataTable with this syntax:

    $('#revTable').dataTable( {
        "bJQueryUI": true,
        "bAutoWidth": false,
        "aaData": aaData,  //the data for the table
        "bDestroy": true,
        aoColumns        : [
            {"sWidth":"275px"},  //Revision Nbr
            {"sWidth":"275px"},  //Saved By
            {"sWidth":"275px"},  //Timestamp
            {"sWidth":"800px"}  //Comment
        ],
        "createdRow": function( row, data, dataIndex ) {
             if ( data[3] == "NONE" ) {
             $(row).addClass( 'important' );
             }
         }
    } );

When I run render this jsp page in FireFox, Firebug throws this error:

    TypeError: $(...).dataTable is not a function
"createdRow": function( row, data, dataIndex ) {

When I remove the "createdRow" code from the syntax above, as such:

     $('#revTable').dataTable( {
        "bJQueryUI": true,
        "bAutoWidth": false,
        "aaData": aaData,  //the data for the table
        "bDestroy": true,
        aoColumns        : [
            {"sWidth":"275px"},  //Revision Nbr
            {"sWidth":"275px"},  //Saved By
            {"sWidth":"275px"},  //Timestamp
            {"sWidth":"800px"}  //Comment
        ]
    } );

.... Firebug throws this error:

TypeError: $(...).dataTable is not a function
{"sWidth":"800px"} //Comment

These errors were not occurring when I used an earlier version of jquery.dataTable.js and an earlier version of jquery, specifically "jquery-1.7.2.min.js".

Can somebody please let me know why these errors are being thrown when using the latest versions of these software packages? Has the syntax changed? Perhaps the errors are very simple however I am not seeing them. Thank you for your time. Gary

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,516Questions: 1Answers: 10,472 Site admin
    Answer ✓

    TypeError: $(...).dataTable is not a function

    Sounds very much like DataTables hasn't been loaded. Or perhaps you are loading jQuery twice on the page? Can you please link to a test case, as required in the forum rules, so we can take a look and say?

    Allan

  • gmarshall56gmarshall56 Posts: 15Questions: 6Answers: 0

    Sorry sir, I'm new to this forum. Where is the link to these forum rules so that I can see how to link to a test case? Thank you. Gary

  • gmarshall56gmarshall56 Posts: 15Questions: 6Answers: 0

    Never mind. I found it. thx

This discussion has been closed.