Material Data Table

Material Data Table

Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

Hi, I am loading material data table in asp.net but getting this specific error : .dataTable is not a function

These are below files which i am including in my head section :

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/js/materialize.min.js"></script>

I have tried every sequence and restart application and cache clearing etc. nothing worked also I have seen no other jquery been linked to page.

This error is there in console :

jquery.min.js:2 Uncaught TypeError: $(...).dataTable is not a function
at HTMLDocument.<anonymous> (test:321)
at l (jquery.min.js:2)
at c (jquery.min.js:2)

Any help would be appreciated thanks in advance.

P.S. : This same code is working perfectly fine in notepad++ but showing this error in vs studio 2015 with asp.net.

Answers

  • allanallan Posts: 63,332Questions: 1Answers: 10,436 Site admin

    My guess is that you are loading jQuery multiple times on the page. Load it only once.

    Allan

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    @Allan , can i share the entire code here

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0
  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    And this is in head section :

    @model IEnumerable<EatAndPlay.ViewModels.City>
    @{
    ViewBag.Title = "Try";
    }
    <html lang="en">
    <head>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/js/materialize.min.js"></script>
    

    </head>

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    Rest Body, Style and Script elements i have pasted as it is in JsFiddle

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    Please help me anyone today any how i need to add this to my page... Thanks in Advance

  • kthorngrenkthorngren Posts: 21,246Questions: 26Answers: 4,929

    I'm seeing "Uncaught ReferenceError: jQuery is not defined" in your example. I don't see where you are loading the CSS and JS includes in the example.

    Please update the example with these.

    Kevin

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    Hi yes my error got resolved .... by looking at the code can someone see is this server side datatable ?

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    @Allan if u have seen the script ? is it server side

  • tangerinetangerine Posts: 3,365Questions: 39Answers: 395

    If it says "serverSide": true, it's server-side.

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    means pagination is server side ...actually i am completly new to this so thats y ....u can see code here https://jsfiddle.net/wa1tr5xn/

  • allanallan Posts: 63,332Questions: 1Answers: 10,436 Site admin

    I'm seeing the same error as Kevin - jQuery isn't loaded on it, nor is DataTables.

    Your code does not currently use server-side processing.

    Allan

  • Aditya14Aditya14 Posts: 27Questions: 5Answers: 0

    Now the code is working fine, but is not server side datatable ... i mean pagination is not server side
    ?

  • allanallan Posts: 63,332Questions: 1Answers: 10,436 Site admin

    Can you give me the updated URL with the working code?

    Allan

This discussion has been closed.