CODEWITHSUNDEEP
javascriptjqueryasp.net-mvcgoogle-chromeinternet-explorer
MrProgram
MrProgram

Reputation: 5242

Importing javascript library works in chrome but not IE

I'm using ASP.NET MVC 5 and I'm trying to import some javascript libraries as jquery, bootstrap.js and some more. It's working fine in Chrome but not in IE 11.

Can anyone see what I am missing?

BundleConfig:

public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-2.1.4.js",
                    "~/Scripts/jquery-2.1.4.min.js",
                    "~/Scripts/EventReader.js",
                    "~/Scripts/jquery.floatThead.js",
                    "~/Scripts/jquery.floatThead.min.js",
                    "~/Scripts/jquery.unobtrusive-ajax.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));

        // Use the development version of Modernizr to develop with and learn from. Then, when you're
        // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));

        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/respond.js"));

        bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/bootstrap.min.css",
                  "~/Content/EventReader.css"));
    }

_Layout:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Styles.Render("~/Content/bootstrap")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")


</head>
<body>
<div class="container body-content">
@RenderBody()
@RenderSection("scripts", required: false)
</div>

</body>
</html>

And my View(Index):

@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}

<html>
<head>
<meta name="viewport" content="width=device-width"/>
<title>Index</title>

</head>
<body>
</body>

In IE11 I get following Errors:

Object doesn't support property or method 'addEventListener' (jquery-2.1.4.js).
Object doesn't support property or method 'addEventListener' (jquery-2.1.4.min.js)
Bootstrap's JavaScript requires jQuery (bootstrap.js)

Upvotes: 0

Views: 1288

Answers (1)

Dandy
Dandy

Reputation: 2177

Add <meta http-equiv="X-UA-Compatible" content="IE=Edge"> in document head section to force IE to render with the latest IE version's standard.

Upvotes: 1

Related Questions