Tuesday, October 16, 2012

Multipart Form Data Using Ajax For IE 7+ Browsers

The only simple way to handle ajax call to upload multipart form data in IE 7+ browsers .

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery Ajax File Upload Plugin</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
    <script src="http://malsup.github.com/jquery.form.js"></script>

    <script>
        // wait for the DOM to be loaded
        $(document).ready(function() {
            // bind 'myForm' and provide a simple callback function
            $('#myForm').ajaxForm(function() {
                alert("Thank you for your comment!");
            });
        });
    </script>
</head>
<body>
<form id="myForm" action="your URL" method="post" enctype="multipart/form-data">
           TextField <input type="text" name="formName"/>
           File<input type="file" name="fileName"/>
              <input type="submit" />
</form>
</body>
</html>


If you get an access denied Error in IE 7+.

I commented these lines in j query.form.js then every thing works fine for me. Don't ask me the reason, even i don't have the solution for that but it works for sure.

            if (io.contentWindow.document.execCommand) {
              try { // #214
                   io.contentWindow.document.execCommand('Stop');
             } catch(ignore) {}
          }