无法使用ajax() post提交表单数据
Unable to submit form data using ajax() post
我使用$.ajax()
方法提交了一个表单数据,数据包含图像文件。在提交时,我遇到了以下问题:
- 表单无法在IE10,11中提交
- 虽然在chrome和FF中提交,但
ajax()
同时执行成功和错误方法 - 我能够在chrome和FF中提交数据,但它只显示错误信息
- 数据从Chrome和FF提交到DB
$.fn.serializeObject = function()
{
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};
$(function() {
$('form').submit(function() {
var senddata = JSON.stringify($('form').serializeObject());
$('#result').text(senddata);
var form_data = new FormData($(this)[0]);
form_data.append('jsonString', senddata);
var settings = {
"async": true,
"crossDomain": true,
"url": "google.com",//sample url
"method": "POST",
"processData": false,
"contentType": false,
"headers": {
"Access-Control-Allow-Origin": "*",
"cache-control": "no-cache"
},
"mimeType": "multipart/form-data",
"cache": false,
"data": form_data//,
//"dataType": "jsonp"
};
$.ajax(settings).done(function (data) {
console.log(data);
})
.success(function (data) {
alert("submitted");
})
.error(function (data){
alert("failed");
console.log(data);
});
return false;
});
});
<!-- language: lang-html -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form action="">
<input type="hidden" name="profileTypeId" value="112" maxlength="36" size="12"/>
First Name:<input type="text" name="firstName" value="Hydtest" maxlength="12" size="12"/> <br/>
Last Name:<input type="text" name="lastName" value="3SparrowTest" maxlength="36" size="12"/> <br/>
email:<input type="text" name="emailId" value="jackSparrow@testmail.com" maxlength="36" size="12"/> <br/>
Address1:<input type="text" name="address1" value="PiratesTest" maxlength="36" size="12"/> <br/>
<input type="hidden" name="address2" value="PiratesTest" maxlength="36" size="12"/>
<input type="hidden" name="city" value="caribbean" maxlength="36" size="12"/>
Profile Image: <input name="file" type="file" /><br />
<p><input type="submit" /></p>
</form>
<!-- end snippet -->
我认为表单没有提交是因为图片。在把图片提交给服务器之前,你能不能试试base64编码?
这里是使用javascript的base64编码图像的参考:
https://davidwalsh.name/convert-image-data-uri-javascript相关文章:
- 在POST中将html表作为csv提交
- JS表单提交"无法使用Chrome数据保护程序加载此页面.尝试重新加载页面.调试信息:POST CISmtuK
- POST时未提交Javascript值
- Ajax Post-Submit函数提交两次
- 使用POST提交按钮,而不是使用HTML表单
- CSS在第一次点击jQuery.post提交时没有应用,然后在随后的点击中没有更新
- 在PHP中对JSON进行编码并使用POST提交
- 如何使用 JQuery 和 PHP 通过 POST 提交 attr 值和表单值
- 通过 ajax post 提交的 Rails 表单不调用成功或错误回调函数
- 通过ajax POST提交两次表单
- Angular表单不通过post提交
- 如何使用restify和post提交表单数据
- PHP -调用一个带有post提交的函数
- codeigniter或PHP -如何在特定的AJAX POST提交后转到URL
- Post提交按钮
- 无法使用ajax() post提交表单数据
- 表单POST提交请求显示为get请求
- Jquery POST提交空白变量
- 如何在cakephp中实现ajax post提交
- AJAX/PHP多表单POST提交