DataTables
Advanced interaction
features for your tables.
Editor
Comprehensive editing
library for DataTables.
Manual
Download
≡ Show site navigation

Create separate js file and call in separate html

Create separate js file and call in separate html

rajc2020rajc2020 Posts: 10Questions: 3Answers: 0
in Free community support

This is my test case:

http://live.datatables.net/podexico/9/

Currently, the javascript code I've written sits inside the html file. I tried to take the javascript code and put it into a file called myscript.js and i referenced it in the html code as follows:

<script type="text/javascript" src="/js/myscript.js"></script>

I know it can find the js file but I think I need to include some imports into my javascript. Any help with this would be greatly appreciated!

Raj

Answers

  • rajc2020rajc2020 Posts: 10Questions: 3Answers: 0

    Basically, all of my table functionality that I have coded is gone and only seems to work when the javascript is present in the html file with the table declaration and data

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    The order of the files are important, so you would need to put that file after the dependent files in the list - but other than that, it should be fine. If that doesn't hep, can you link to a page showing the problem, please.

    Colin

  • rajc2020rajc2020 Posts: 10Questions: 3Answers: 0

    Thanks for your response! I think I'm stuck with how I put in the dependent files in the external javascript file.

    http://live.datatables.net/podexico/9/

    If you go to my javascript here and if I were to make that a completely separate file, are there similar things to import declarations I need in the external js file?

  • kthorngrenkthorngren Posts: 21,717Questions: 26Answers: 5,026
    edited July 2020

    You just add a script include statement like you have for the other .js files:

      <head>
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/jszip-2.5.0/dt-1.10.21/af-2.3.5/b-1.6.2/b-colvis-1.6.2/b-flash-1.6.2/b-html5-1.6.2/b-print-1.6.2/cr-1.5.2/fc-3.3.1/fh-3.1.7/kt-2.5.2/r-2.2.5/rg-1.1.2/rr-1.2.7/sc-2.0.2/sp-1.1.1/sl-1.3.1/datatables.min.css"/>
     <script type="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
   
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/jszip-2.5.0/dt-1.10.21/af-2.3.5/b-1.6.2/b-colvis-1.6.2/b-flash-1.6.2/b-html5-1.6.2/b-print-1.6.2/cr-1.5.2/fc-3.3.1/fh-3.1.7/kt-2.5.2/r-2.2.5/rg-1.1.2/rr-1.2.7/sc-2.0.2/sp-1.1.1/sl-1.3.1/datatables.min.js"></script>
    <script type="text/javascript" src="https://code.highcharts.com/highcharts.js"></script>
    <script type="text/javascript" src="https://code.highcharts.com/modules/exporting.js"></script>
    <script type="text/javascript" src="/js/myscript.js"></script>
    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>

    are there similar things to import declarations I need in the external js file?

    You are already loading the dependent files in the head of your page.

    Kevin

This discussion has been closed.

DataTables

DataTables designed and created by SpryMedia Ltd.
© 2007-2023 MIT licensed. Privacy policy. Supporters.
SpryMedia Ltd is registered in Scotland, company no. SC456502.