Saturday, 1 June 2013

Common IE Issues

1.  Bootstrap is not working:
Implement docmode, Insert <!DOCTYPE html> into your HTML page. It should the first line in your html page, even if first line is comment bootstrap will not work.

2.  IE 8, give download option when content type is application/json
Simply change the content type in header to “text/html”.
For grails user here is the lucky line
render text: (model as JSON).toString(), contentType: 'text/html'

P.S You can configure IE8 to display application/json in the browser window by updating the registry.

3.   Placeholder are not working in IE.
I have used a jquery plugin for placeholders to work in IE. Thanks Andrew for writing this plugin.

Issues with this plugin:

a) It does not work with password field. I have comment out the code in the plugin to only show some dots if the field type is password. Line number 72 in v0.7.0 of the plugin.
/*
      if ($el.is(':password')) {
        return;
      }
*/
b) If you are using bootstrap modal dialog box then there comes error on IE 8. You need to add a null check on line 94 of in plugin version 0.7.0
if (this.value === '') {
          if($el.val($el.attr('placeholder')) != null)
            $el.val($el.attr('placeholder')).addClass(opts.activeClass);
        }
      });  

4. When type in password field, only the curser moves the bullets is not showing up in IE8
In my application we are using google font, so add following script in the head of the html page.
<!--[if lte IE 8]>
<style>
input[type="password"] {
font-family: Arial;
 }
</style>
<![endif]-->

5. Trim method for java script is not working in IE 8
I have used jquery trim method, for example
$.trim(myStringField)

6.  While downloading file, IE opens the file in the explorer rather giving option to download.
response.setContentType("application/octet-stream")
response.setHeader("Content-disposition", "attachment; filename=myfileName.txt")

By adding attachment; in Content-disposition gives option to download the file.

Will add more ...