Prevent my website from running in Internet Explorer

I don’t want anyone to run my website in Internet Explorer, so I have added the following JavaScript call at the very beginning of the first .js file in my website, the file name is screen.js

screen.js

"use strict";

// block Internet Explorer as soon as possible
(function () {
    var isIE = /Trident|MSIE/.test(navigator.userAgent);
    if (isIE) {
        $('#blockIeModal').modal({ // <-- this is a modal that informs user that IE is not supported
            backdrop: 'static',
            keyboard: false
        });
    }
})()

JavaScript
​x
 
"use strict";
​
// block Internet Explorer as soon as possible
(function () {
    var isIE = /Trident|MSIE/.test(navigator.userAgent);
    if (isIE) {
        $('#blockIeModal').modal({ // <-- this is a modal that informs user that IE is not supported
            backdrop: 'static',
            keyboard: false
        });
    }
})()
​

I have the following .js files in my bundle (ASP.NET MVC syntax):

bundles.Add(new ScriptBundle("~/bundles/app").Include(
    "~/Scripts/app/screen.js",
    "~/Scripts/app/common.js",
    "~/Scripts/app/url-builder.js",
    "~/Scripts/app/dropdown-common.js",
    "~/Scripts/app/bootstrap-table-common.js",
    "~/Scripts/app/numeric-format.js",
    "~/Scripts/app/megamenu-builder.js"));

JavaScript
 
bundles.Add(new ScriptBundle("~/bundles/app").Include(
    "~/Scripts/app/screen.js",
    "~/Scripts/app/common.js",
    "~/Scripts/app/url-builder.js",
    "~/Scripts/app/dropdown-common.js",
    "~/Scripts/app/bootstrap-table-common.js",
    "~/Scripts/app/numeric-format.js",
    "~/Scripts/app/megamenu-builder.js"));
​

The above code runs fine in Chrome but IE does not like some of the syntaxt that I have used in my .js file, for example in the screenshot below IE is complaining that there is a syntax error on line 96 of common.js:

And because of this error I don’t get the block IE popup which was supposed to be shown in the earlier call… I am confused because I though I am blocking IE at the very first step… so cannot understand why these Syntax errors are being shown?

Update

I tried the approach suggested by @Nick Olay, see the screenshot below it still shows the loading dots which not supposed to be displayed in IE…

Answer

Thanks to the comment by @epascarello, I managed to solve the issue by detecting the browser on the server side, here is what I have done:

Server side function to detect IE:

public static class BrowserHelper
{
    public static bool IsInternetExplorer()
    {
        var userAgent = HttpContext.Current.Request.UserAgent;
        if (userAgent.Contains("MSIE") || userAgent.Contains("Trident"))
        {
            return true;
        }
        else
        {
            return false;
        }
    }
}

JavaScript
 
public static class BrowserHelper
{
    public static bool IsInternetExplorer()
    {
        var userAgent = HttpContext.Current.Request.UserAgent;
        if (userAgent.Contains("MSIE") || userAgent.Contains("Trident"))
        {
            return true;
        }
        else
        {
            return false;
        }
    }
}
​

And I build the HTML page, based on the above function call:

<body>
    @if (BrowserHelper.IsInternetExplorer())
    {
        <P>IE is an out dated browser...</p>
    }
    else
    {
         <!-- Actual Page HTML -->
    }
</body>

JavaScript
 
<body>
    @if (BrowserHelper.IsInternetExplorer())
    {
        <P>IE is an out dated browser...</p>
    }
    else
    {
         <!-- Actual Page HTML -->
    }
</body>
​

Update

Advertisement

Answer