DataTable() not a function

2,263 views
Skip to first unread message

Dave S

unread,
Dec 2, 2021, 7:30:20 AM12/2/21
to web2py-users
That's the error I'm getting, according to Chrome's console.

The view code is pretty simple:

<script>
var table;
$(document).ready(function(){
   table = $('#tableXactions').DataTable( {
       "data": {{=results}} ,
       "columns": [
            /* { data: 'xaction.PostDate'}, */
                                 { data: 'xaction.Id' },
                                 { data: 'xaction.Amount' },
                                 { data: 'xaction.Expense' },
                                 { data: 'xaction.Tag' }
            
        ]
       
    });

     });
</script>

<table id="tableXactions" >
   <thead>
       <tr>
          <th>Id</th>
          <th>Amount</th>
          <th>Expense</th>
          <th>Tag</th>
       </tr>
    </thead>
    <tbody></tbody>
</table>

The console shows that jquery.dataTables.min.js (and the css) is loaded from the datatables.net cdn (1.10.19, not the latest but close).  Both my debug code and the console show that my results are as expected, so I don't think the controller is where I messed up.
 
The actual console message is 

listing:96 Uncaught TypeError: $(...).DataTable is not a function
    at HTMLDocument.<anonymous> (listing:96)
    at i (jquery.js:2)
    at Object.fireWith [as resolveWith] (jquery.js:2)
    at Function.ready (jquery.js:2)
    at HTMLDocument.K (jquery.js:2)
(listing is my view/default/listing.html)
  
I get this error even if I have no options in the DataTable() call.  (And I should be using DataTable(), not the dataTable() version, right?  Equivalent, but different return types....)

I have Roger's example, but it's much more complex than I'm ready for.  The sample on web2pyslices.com is about right, but uses a much older version.  The examples on datatables.net are snippets that they assume you know where to put them.

What's the fix for my mistake (or at least, what's my mistake?)

/dps

Dave S

unread,
Dec 2, 2021, 7:51:53 AM12/2/21
to web2py-users
On Thursday, December 2, 2021 at 4:30:20 AM UTC-8 Dave S wrote:
That's the error I'm getting, according to Chrome's console.


Do I have a conflict between dot-js files?

Dave S

unread,
Dec 20, 2021, 11:01:32 PM12/20/21
to web2py-users
Jim?  Other datatable gurus?

/dps


On Thursday, December 2, 2021 at 4:30:20 AM UTC-8 Dave S wrote:

Jim S

unread,
Dec 21, 2021, 4:05:08 PM12/21/21
to web2py-users
I wish I could help, but I'm not javascript guru.  That's why I've moved to py4web, grid and htmx.

Do you have the datatables .css and .js files loaded?  jquery.dataTables.min.js is not all that you need.


-Jim

Dave S

unread,
Dec 23, 2021, 7:38:50 PM12/23/21
to web2py-users
On Tuesday, December 21, 2021 at 1:05:08 PM UTC-8 Jim S wrote:
I wish I could help, but I'm not javascript guru.  That's why I've moved to py4web, grid and htmx.

Do you have the datatables .css and .js files loaded?  jquery.dataTables.min.js is not all that you need.


-Jim



Thank you, that was a useful clue.  I am now able to get it to draw the table.  Next, figuring out why the data isn't showing.

/dps

Jim Steil

unread,
Dec 23, 2021, 7:44:23 PM12/23/21
to web...@googlegroups.com
If you look at your page source can you see what is being rendered for [[=results]] in your script section?

Jim


--
Resources:
- http://web2py.com
- http://web2py.com/book (Documentation)
- http://github.com/web2py/web2py (Source code)
- https://code.google.com/p/web2py/issues/list (Report Issues)
---
You received this message because you are subscribed to a topic in the Google Groups "web2py-users" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/web2py/L6M5EBRE1kM/unsubscribe.
To unsubscribe from this group and all its topics, send an email to web2py+un...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/web2py/b7bb9aa4-968e-4431-9daf-1b4dab898c80n%40googlegroups.com.
Reply all
Reply to author
Forward
0 new messages