Cannot load local JQuery file when viewing site in IE 8

Question

I am attempting to use the datetimepicker control (http://timjames.me/jquery-ui-datetimepicker-plugin) but it appears my local js file is having trouble loading - but only in IE (version 8.0.6) as it works fine in Firefox version 18.0.

I use a master page named with placeholder "MainContent" so all of my child page controls need to be referenced by MainContent_ followed by the ID of the control.

The element in the master page contains the following script includes:

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.16/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.16/themes/hot-sneaks/jquery-ui.css" />
<script type="text/javascript" src="Scripts/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        alert("hello");
        $('#MainContent_calStart').datetimepicker();
    });
</script>

script language="javascript" type="text/javascript">
    function GetItem(strName) {
        return document.all ? document.all[strName] : document.getElementById(strName);
    }

... etc etc etc

My asp.net child page contain the code:

Basically, the page hosting the datetimepicker is not the first page loaded in the site, but due to the master page containing the script includes (and being unable to load them all), the first page of the site loads with js errors.

I cannot load/include ANY local JQuery files in to my site when using IE as I get Javascript error:

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; InfoPath.1; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET CLR 1.1.4322; .NET4.0C; .NET4.0E) Timestamp: Tue, 15 Jan 2013 13:31:47 UTC

Message: Syntax error Line: 3 Char: 1 Code: 0 URI: (path to page on localhost)

The site bombs at line $('#MainContent_calStart').datetimepicker(); with error "Microsoft JScript runtime error: Object doesn't support this property or method" indicating the browser has been unable to find the source/declarations for the datetimepicker widget from within the include file. If I continue loading the site despite the js error, the datetimepicker widget loads and appears to be fully functional.

The strange thing is, if I take the code and create a sample website project in VS2010, and include the files/code as above, the sample site works. The only difference between the sample and my live site is there is additional pages/css/js files in the live site. The structure of the 2 sites is the same in terms of script locations/css locations etc. The sample site works fine in both IE and FF.

One final thing, if I move all of the code from jquery-ui-timepicker-addon.js into the master page itself and exclude the js file, the site works. This points to the fact the js code is not being loaded when in a local file.

Any help is appreciated. Cheers.

Jimmy

PS. I cannot include ANY local js file, not just the one in question.

score 0 · Answer 1 · answered Jan 15 '13 at 13:46

Try this in your master page code behind

private void AddScript(string src) { HtmlGenericControl genCtrl = new HtmlGenericControl(); genCtrl.TagName = "script"; genCtrl.Attributes.Add("type", "text/javascript"); genCtrl.Attributes.Add("language", "javascript"); genCtrl.Attributes.Add("src", src); Page.Header.Controls.Add(genCtrl); }

protected void Page_Load(object sender, EventArgs e)
{ 
    // one minute prior to timeout (milliseconds)
    //timeout = (Session.Timeout * 60000) - 60000;
    Session.Timeout = 90000;

    AddScript(Page.ResolveUrl("~/Scripts/jquery-1.6.1.js"));
    AddScript(Page.ResolveUrl("~/Scripts/jquery-ui.min.js"));
    //AddScript(Page.ResolveUrl("~/Scripts/jquery-1.4.3.min.js"));
    //AddScript(Page.ResolveUrl("~/Scripts/jquery.tablesorter.min.js")); 
}

you will need a header runnat = server.

The issue could be your asp.net web-pages are not in the root directory where the master page is so paths to your scripts are incorrect.

If you are developing an internet site rather use cdn files as it will save you bandwidth + lots of CDN files are pre-loaded / cached by cdn networks.

score 0 · Accepted Answer · answered Jan 15 '13 at 13:46

I had the same error (Object doesn't support this property or method) in IE8 when I used a plugin (also in the jQuery plugin itself) which used indexOf (http://www.w3schools.com/jsref/jsref_indexof.asp). This function is somehow not supported in IE8. I changed this function to in.Array function of jQuery (http://api.jquery.com/jQuery.inArray/), and stupid enough: this also uses indexOf.

To solve it, I replaced this function for a for-loop which searches the array/string/... only that solved my problem on IE8.

I hope it helps!

Here is how you can polyfill indexOf in browsers that don't support it: http://stackoverflow.com/questions/1744310/how-to-fix-array-indexof-in-javascript-for-ie-browsers — Tom Pietrosanti, Jan 15 '13 at 13:51

Cannot load local JQuery file when viewing site in IE 8

2 Answers2