Why are JS scripts working in the wrong order?

Question

In my web application, you can open an iframe that loads the report (similar to an excel spreadsheet). Reports open normally (15-20 times). At some point, I will start to always get JS errors stating that kendo is undefined, and sometimes I get "Out of memory" errors in the IE console.

As you can see in my HTML file, the kendo.all.min.js file is in front of the kendo.sage.custom.min.js file.

<script type="text/javascript" src="/Scripts/kendo/web/kendo.all.min.js"></script> <script type="text/javascript" src="/Scripts/kendo/kendo.sage.custom.min.js"></script> 

When everything goes well, fiddler shows

But when I start getting errors, I see the following:

So for some reason, after using my application, the scripts will load in the wrong order for a while.

So, I added console.log ("all") and console.log ("sage") at the top of each script. During normal operation, I can see “everything” in order, and then “sage”, but when I start to get the kendo undefined error, all I see is the “sage” journal, and not “everything”.

We use ASP.NET MVC, and the scripts are in our layout file in the chapter section.

What can cause scripts to run in the wrong order?

Answer 1

Is all the script in the chapter section? If not, move the user code to the footer and load the user script after the page loads, this will ensure the user file loads after the main file

 $(window).load(function(){ var element = document.createElement("script"); element.src = "/Scripts/kendo/kendo.sage.custom.min.js"; document.body.appendChild(element); }); 

And for your answer, refer to this download link and execute the script order