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.
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.
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>
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>
i fetch the same problem but I solved this by adding this into head tag
<meta charset="utf-8">
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.
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