Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

IE 8 - Scripts not always load

It's been a common problem among my team for a while. For aparently no reason, IE8 only loads the scripts sometimes. I'm using asp.net mvc3 and some scripts are loaded through _layout.cshtml (which is like a master page that all my others pages inherits). The other bunch of scripts are loaded only when needed. I must mention that i began to use Head.js to load my scripts. I was actually hoping that it would fix the IE8 scripts load problem.

These problems don't occur on firefox or chrome (which is another motive i'm certain it only happens on IE). And as it seems, if a single script breaks on IE8, this break propagates through other scripts.

I understand this may be a problem too broad to be solved with just the forementioned situation. So what i'd like to know is have you had a problem like this? If yes, what did you do to solve it? I really appreciate some directions, since i have to use IE.

Here is the scripts that are being loaded on _layout.cshtml, in the order of loading:

  • Head.js;
  • jquery-1.5.1.min.js;
  • modernizr-1.7.min.js;
  • jquery-ui-1.8.11.min.js;
  • jquery.ui.datepicker-pt-BR.js;
  • jquery.validate.min.js;
  • jquery.validate.unobtrusive.min.js;

An these are some of the other scripts that i use on some pages (it's not in their order):

  • jquery-blockUI.js;
  • jquery.jqGrid-4.1.2.min.js;
  • jquery.orbit-1.2.3.min.js;
  • jquery.jqplot.min.js (and some of it's renderers);
  • jquery.form.wizard-min.js;
  • ZeroClipboard.js;

EDIT

As T.J. asked for some piece of code, since it would be to hard to identify the problem with only the name of scripts used, here it is.

Scripts loaded on _layout.cshtml

<head>
<script src="@Url.Content("~/Scripts/head.min.js")" language="javascript"  type="text/javascript"></script>

//Lots of css files loaded mostly through document.write

<script type="text/javascript" language="javascript">
        //        if (head.browser.mozilla || head.browser.webkit || head.browser.opera ||
        //      (head.browser.ie && (head.browser.version == '9.0'))) {
        head.js('@Url.Content("~/Scripts/jquery-1.5.1.min.js")')
                .js('@Url.Content("~/Scripts/modernizr-1.7.min.js")')
                .js('@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")')
                .js('@Url.Content("~/Scripts/jquery.ui.datepicker-pt-BR.js")')
                .js('@Url.Content("~/Scripts/jquery.validate.min.js")')
                .js('@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")');
        if (screen.width == 1024) {
            head.js('@Url.Content("~/Scripts/resolucao1024.js")');
        } else {
            head.js('@Url.Content("~/Scripts/resolucaoMaior1024.js")');
        }
</script>
@RenderSection("Header", false)
</head>

Scripts loaded on a charts and graphics page

@section Header{
<script type="text/javascript" language="javascript">
        head
        .js('@Url.Content("~/Scripts/jquery-blockUI.js")')
        .js('@Url.Content("~/Scripts/jqGridMVC/grid.locale-pt-br.js")')
        .js('@Url.Content("~/Scripts/jqGridMVC/jquery.jqGrid-4.1.2.min.js")')
        .js('@Url.Content("~/Scripts/jquery-ConfigAjax.js")')
        .js('@Url.Content("~/Scripts/jqPlot/jquery.jqplot.min.js")')
        .js('@Url.Content("~/Scripts/jqPlot/jqplot.highlighter.min.js")')
        .js('@Url.Content("~/Scripts/jqPlot/jqplot.dateAxisRenderer.min.js")')
        .js('@Url.Content("~/Scripts/jqPlot/jqplot.pieRenderer.min.js")')
        .js('@Url.Content("~/Scripts/jqPlot/jqplot.donutRenderer.min.js")')
        .js('@Url.Content("~/Scripts/jqPlot/jqplot.cursor.min.js")');
    </script>
}

EDIT 2

Oh! i forgot to mention that every time i call some javascript functionality, i use head(function() {}) instead of $(function(){}) (it's recommended on head.js site).

EDIT 3

As Zeta asked, i'm providing a print from IE console (it's from my charts and graphic page).

enter image description here

Since i'm brazilian, it's in portuguese. Simple to understand though: it means 'jqplot' is null or is not an object. Like jqplot was never loaded or had some problem during the loading.

like image 716
AdrianoRR Avatar asked Jul 23 '26 06:07

AdrianoRR


2 Answers

I resolved doing this:

head.js("js/jquery-1.7.1.min.js",
 function() {
   head.js("js/script.js");
   head.js("js/script1.js");
   head.js("js/script2.js");
   head.js("js/script3.js");
});

Hope it helps

like image 97
NickHTTPS Avatar answered Jul 24 '26 21:07

NickHTTPS


Broad question, so I cant promise this will fix it.

But I think about a year ago I had a problem with IE8 and script tags which sounds just like yours.

I noticed that if the script tag did not have all the added extras:

type="text/javascript" language="javascript"

and the server did not send http header-> content type: text/javascript

It did not work.

Give it a check, but thats all I got

like image 27
Roderick Obrist Avatar answered Jul 24 '26 21:07

Roderick Obrist



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!