javascript - .Datatable is not a function -
i try table feature https://datatables.net/examples/basic_init/scroll_xy.html
i have dropdown , date picker add links table , datetime picker links add table , use script when select datetime picker calendar not display when check console show error
i try export table data in excel
webform1.aspx:34 uncaught typeerror: $(...).datatable not function
code
<%--for tabledata--%> <script type="text/javascript" src="//code.jquery.com/jquery-1.12.3.js"></script> <script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/jquery.datatables.min.js"></script> <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/jquery.datatables.min.css" /> <link href="styles/stylechart.css" rel="stylesheet" /> <!--for date--%>--> <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" /> <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script> <script type="text/javascript" src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> <script type="text/javascript"> $(document).ready(function () { $("#tabledata").datatable({ dom: 'bfrtip', buttons: [ 'excelhtml5' ] }); }); </script> <table id="tabledata" cellspacing="0" class="display nowrap inner_table"> </table>
updated:
success: function (result) { var final = json.parse(result.d).response; console.log(json.parse(result.d).response); $("#tabledata").empty(); if (final.length > 0) { $("#tabledata").append( "<thead><tr><th>regno</th></tr></thead>"); (var = 0; < final.length; i++) { if (final[i] !== null) { $("#tabledata").append("<tbody><tr><td>" + final[i][0] + "</td> </tr></tbody>"); } } }
you using multiple references of jquery file.also order more important plugin work properly. try avoid writing protocol http or https before script reference , add simple // , automatically detect on protocol app working , load reference file according it.
change reference section scripts given below.
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/jquery.datatables.min.css" /> <link href="styles/stylechart.css" rel="stylesheet" /> <!--for date--%>--> <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" /> <script type="text/javascript" src="//code.jquery.com/jquery-1.12.4.js"></script> <script type="text/javascript" src="//code.jquery.com/ui/1.12.0/jquery-ui.js"></script> <script type="text/javascript" src="//cdn.datatables.net/1.10.12/js/jquery.datatables.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $("#tabledata").datatable({ dom: 'bfrtip', buttons: [ 'excelhtml5' ] }); }); </script> <table id="tabledata" cellspacing="0" class="display nowrap inner_table"> <thead> <tr> <th>column1</th> <th>column2</th> <th>column3</th> <th>column4</th> </tr> </thead> </table>
Comments
Post a Comment