jQuery POST does not submit form values using IE 11

问题

I have tried to find a solution for this problem for hours now, but the following code is simply not working for Internet Explorer 11. It does work for Chrome and Firefox. When using IE11 the post is submitted but the submitted form is empty.

<!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
            <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
        </head>
        <body>
            <form action="/Mandate/Edit" id="mandateForm" method="post">            
                <input id="ExternalId" name="ExternalId" type="hidden" value="" />
                <input id="mandateName" name="mandateName" type="text" />
                <a href="#" id="md-submit">Create</a>
            </form>
            <script type="text/javascript">
                $(function () {
                    $("#md-submit").on("click", function (e) {
                        e.preventDefault();
                        var form = $("#mandateForm");
                        var request = $.ajax({
                            type: "POST",
                            url: form.attr("action"),
                            data: {
                                mandateName: "test4711"
                            },
                            dataType: 'json',
                            cache: false
                        });
                    });
                });
            </script>
        </body>
    </html>

Thank you very much for your help.

回答1:

There eem to be some problems around with form serialization in ie in jquery. I usually use this plugin : http://jquery.malsup.com/form/#api

This seems to be the easiest way to solve the problem. But its far from the cleanest way. Another thing you could try is : make the server listen to json requestdata . and serialize it to a json string. Or make a serialize function yourself. which would be just like 3 lines of code.

回答2:

don't worry you try to send data with serialization() method i hope you problem may be solved try this.

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
    </head>
    <body>
        <form action="/Mandate/Edit" id="mandateForm" method="post">            
            <input id="ExternalId" name="ExternalId" type="hidden" value="" />
            <input id="mandateName" name="mandateName" />
            <a href="#" id="md-submit">Create</a>
        </form>
        <script type="text/javascript">
            $(function () {
                $("#md-submit").on("click", function (e) {
                    e.preventDefault();
                    var form = $("#mandateForm");
                    var request = $.ajax({
                        type: "POST",
                        url: form.attr("action"),
                        data: $('form#myForm').serialize(),
                        dataType: 'json',
                        cache: false
                    });
                });
            });
        </script>
    </body>
</html>

回答3:

The serialize() method does not convert form data to Json...

This should work--the ouput in IE11 will be {"ExternalId":"","mandateName":"4343"}:

<!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
            <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
        </head>
        <body>
            <form action="/Mandate/Edit" id="mandateForm" method="post">            
                <input id="ExternalId" name="ExternalId" type="hidden" value="" />
                <input id="mandateName" name="mandateName" type="text" />
                <a href="#" id="md-submit">Create</a>
            </form>
            <script type="text/javascript">
                function form_to_json (selector) {
                  var ary = selector.serializeArray();
                  var obj = {};
                  for (var a = 0; a < ary.length; a++) obj[ary[a].name] = ary[a].value;
                  return JSON.stringify(obj);
                }

                $(function () {
                    $("#md-submit").on("click", function (e) {
                        e.preventDefault();
                        var form = $("#mandateForm");
                        var request = $.ajax({
                            type: "POST",
                            url: form.attr("action"),
                            data: form_to_json(form),
                            dataType: 'json',
                            cache: false
                        });
                    });
                });
            </script>
        </body>
    </html>

回答4:

i fetch the same problem but I solved this by adding this into head tag

<meta charset="utf-8">

回答5:

Today we encountered the same problem in IE11. I found out that this is working for me:

$.ajax({
  type: "POST",
  url: "./index.php",
  data: { name: "John", time: "2pm" },					
  cache: false,
  success: function(data){
    $.ajax({
      type: "POST",
      url: "./index.php",
      data: { name: "John", time: "2pm" },							
      cache: false
    });
}});

But this is not:

$.ajax({
  type: "POST",
  url: "./index.php",
  data: { name: "John", time: "2pm" },					
  cache: false,
  success: function(data){
}});

$.ajax({
  type: "POST",
  url: "./index.php",
  data: { name: "John", time: "2pm" },							
  cache: false
});

At this moment it looks like if you are executing multiple AJAX calls at the same time, the POST data will be empty, except the first call. When I am executing them after each other it works.

回答6:

I've found that activating "Enhanced Protected Mode" on IE11 solves this problem.

Internet Options --> Advanced Options --> Enable Enhanced Protected Mode

After that, restar the browser and the POST data is sent.

来源：https://stackoverflow.com/questions/23866149/jquery-post-does-not-submit-form-values-using-ie-11

标签

jquery

internet-explorer-11