0

I have code that builds a table with javascript API about weather data. However once the table is generated the other plug-ins from HTML javascript files will not interact unless I copy and paste the whole plug-in in that specific file which generates the table.

Please offer suggestions on how to construct a reference to functions in other .js files in a .js file or include the file. I have read some that either sound out of date or unclear how to use the reference. Please do not request my whole code demo since it reveals my API key and will not work without it. Just read the outline of what is going on in these comments.

For example, how to reference these js plug-ins

 <!-- Table export plug-in "http://ngiriraj.com/pages/htmltable_export/demo.php" HTML table Export 
  NOTE try to reference these in the javascript file for building tables instead -->
    <script type="text/javascript" src="/Javascript/tableExport.js"></script>
    <script type="text/javascript" src="/Javascript/jquery.base64.js"></script>

So reference in:

  buildTable.js 
    {
    //One of the above .js scripts to be referenced here...
}

Workflow Outline: Some code generates from API a list of data then configures the data into table elements. The table object will only be modified by code in this .js script, other references from the HTML document will not use the functions unless they are in this file. I have tested this and yes, it is true, code pasted in from other .js files into the buildTable.js file works here to deliver the functions from other .js files but the code is messy to maintain. HTML references will not interact with the run-time generated table since the references occur before the code generates and will exclusively run. Also, making the references in the HTML following the javascript buildTable.js or after the elements does not work (and tested). In a way, these functions need nesting in the execution of the script because they are dependent on modifying an active script for what they do (so a means to reference the other .js files would be a great solution!).

  • What if you dynamically add the second js file after DOM ready or after window.load? Please check this: http://stackoverflow.com/questions/3857874/how-to-dynamically-insert-a-script-tag-via-jquery-after-page-load – Ali Sheikhpour Jun 09 '16 at 00:03
  • 1
    I think you should wrap your script in document ready. – user3791775 Jun 09 '16 at 00:09
  • So you mean reference the other scripts then put my code inside the document ready... The issue with that have several plug-ins to modify tables, sort and export... I suppose I could just make one file for them all and reference it once. Which part about the DOM ready or window.load in the quoted page? – practicalPrograms Jun 09 '16 at 00:14
  • I tried this: //Try to reference other .js after DOM ready `// Use any event to append the code $(document).ready(function() { var s = document.createElement("script"); s.type = "text/javascript"; s.src = "sorter_Export.js"; // Use any selector $("head").append(s); });` – practicalPrograms Jun 09 '16 at 00:15
  • No success so far with the sample... – practicalPrograms Jun 09 '16 at 00:20
  • No just load all your scripts and put your custom script in document ready – user3791775 Jun 09 '16 at 00:53
  • Or else look into 'lazy loading javascript libraries' or something on google – user3791775 Jun 09 '16 at 00:54
  • I tried $(document).ready(function() {... }); over the span of my custom code but there are other subfunctions that interact with controls necessary to select which locations in the table to construct it. So the HTML will not cooperate with the checklist buttons. So a wrap over it all will not work. I might see if the document ready can be used in a smaller portion but I may need other ideas. – practicalPrograms Jun 10 '16 at 20:35
  • I wonder if I could construct a hub of code, to load all these scripts at once? – practicalPrograms Jun 10 '16 at 20:41
  • Perhaps a new approach... try to make the resulting table from the tableBuild.js more available to other scripts from the HTML DOM in some way, so the table object is not dependent on the .js file? – practicalPrograms Jun 10 '16 at 21:50

0 Answers0