工作中如何使用ajax提交form表单,包括ajax文件上传
Posted 小_Li_Kelly
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了工作中如何使用ajax提交form表单,包括ajax文件上传相关的知识,希望对你有一定的参考价值。
提供一种方法就是利用jquery.form.js,我们是和java对接的后台。
代码如下:
<input type="text" id="text1">
<input type="text" id="text2">
<input type="text" id="text3">
<form method="post" enctype="multipart/form-data" id="formSubmit">
<div class="wrapBox">
<div class="fileBox clearfix">
<span class="pull-left">上传文件:</span>
<input type="file" class="pull-left" id="loadFile" name="uploadFile">
</div>
</div>
<div class="wrapSubmitBox clearfix">
<input type="button" id="submitBtn" value="提交">
<input type="hidden" id="ajaxParam" name="ajaxParam">
</div>
</form>
//上传文件的input 和提交按钮要写在form里面。<input type="hidden" id="ajaxParam" name="ajaxParam">是存储$(“#text1”),$(“#text2”),$(“#text3”)需要传给后台的数据。
Js:
$("#formSubmit").click(function(){
var valtext1=$("#text1").val();
var valtext2=$("#text2").val();
var valtext3=$("#text3").val();
uploadJsonData="{‘text1‘:"+valtext1+",‘text2‘:"+valtext2+",‘valtext3‘:"+valtext3+"}";
$("#ajaxParam").val(uploadJsonData);
$("#formSubmit");
var options = {
url:‘上传地址‘,
type:‘post‘,
success:function(data){
if(data.success==1){
alert(‘上传成功‘)
}
},
error:function(){
}
};
$("#formSubmit");.ajaxSubmit(options);
});
以上是关于工作中如何使用ajax提交form表单,包括ajax文件上传的主要内容,如果未能解决你的问题,请参考以下文章
使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html
使用JQuery的.ajax()提交表单后当前页面表单内容被清空,请问如何保留数据?