Tuesday 1 April 2014

javascript not working when client side validation used on mvc 4 page in Internet Explorer



The problem is a little bit involved so I'll try summarise.

Back when IE8 was released, a decision was made by Microsoft to default this setting in Compatibility View Settings to checked: "Display intranet sites in Compatibility View" Compatibility view is essentially the IE7 layout engine. This decision was made so that Enterprises with internal websites did not find the sites suddenly broken with the installation of the new browser. Now that we are on IE10 and IE11, Microsoft have stuck with this decision, so by default intranet sites effectively use IE7. Trusted sites are also considered to be on the intranet. The only exceptions to this are localhost or the loopback address (127.0.0.1) as Microsoft decided designers and developers might want to view pages they were developing in the layout engines of the newer browsers.

So, in short, the jQuery code used in the client side validation is not supported by the IE7 layout engine, hence the javascript is crashing. If you view this page on localhost (where the newer layout engine is used) or firefox or chrome it will work.

Two possible solutions for this are:

1) Display intranet sites in Compatibility mode can be unchecked. This can be done on a machine by machine basis or by group policy.

2) Adding these lines to your webconfig:

    <system .webServer>
    <httpProtocol>
      <customHeaders>
        <add name="X-UA-Compatible" value="IE=Edge /">
      </customHeaders>
    </httpProtocol>
  </system .webServer>