87,923
社区成员
发帖
与我相关
我的任务
分享用$("#xxx").ajaxSubmit(XXX)提交上传的image文件时，如何让data里的数据也提交？
代码如下：第一个ajax是在后台获取id放入页面，方便后面对图片进行操作。
问题：用ajaxSubmit()提交表单，能够将form中是数据以及要上传的文件提交到服务器，但是我想在提交的同时带一些参数过去，就是data:{}中的数据，但是在后台接收不到，有哪位大神知道怎么弄吗？
如果不这样做，我如何在前端存放id？后台如何获取？怎样设计好一点？
<%@page pageEncoding="utf-8" contentType="text/html; utf-8" %>
<%@include file="global.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link href="${ctx }/css/user.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function(){
$.ajax({
url:"getId.do",
success:function(result){
if(result.state==SUCCESS){
for(var i=0;i<result.data.length;i++){
if(result.data[i].scope=="body_image"){
$("#body_image").attr("name",result.data[i].id);
alert(result.data[i].id);
}
}
}
}
});
});
function ajaxSubmitForm(form_id, img_id, scope) {
var value = $(img_id).val();
alert(value);
var id=$(img_id).attr("name");
alert(id);
if (!value) {
alert("请先选择文件");
return false;
}
if (!value.match(/.jpg|.jpeg|.jpe|.gif|.png/i)) {
alert("文件格式错误");
return false;
}
var option = {
url : 'file_upload.do',
type : 'POST',
dataType : 'json',
data : {
"scope" : scope,
"filename" : value,
"id":id
},
success : function(result) {
if (result.state == SUCCESS) {
alert(result.data);
}
if (result.state == ERROR) {
alert(result.message) + "--上传失败,请刷新后重试");
}
}
};
$(form_id).ajaxSubmit(option);
return false; //最好返回false，因为如果按钮类型是submit,则表单自己又会提交一次;返回false阻止表单再次提交
}
</script>
</head>
<body>
<div id="administrate" class="administrate">
<div>
<div>
<form action="" id="body_form" method="post" enctype="multipart/form-data">
<input type="file" value="修改网页背景" id="body_image" name=""/>
<input type="button" onclick="ajaxSubmitForm('#body_form','#body_image','body_image')" value="上传"/>
<span>修改整个网页的背景,支持jpg png gif格式</span>
</form>
</div>
</body>
</html>
问题：用ajaxSubmit()提交表单，能够将form中是数据以及要上传的文件提交到服务器，但是我想在提交的同时带一些参数过去，就是data:{}中的数据，但是在后台接收不到，有哪位大神知道怎么弄吗？
如果不这样做，我如何在前端存放id？后台如何获取？怎样设计好一点？
<%@page pageEncoding="utf-8" contentType="text/html; utf-8" %>
<%@include file="global.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link href="${ctx }/css/user.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function(){
$.ajax({
url:"getId.do",
success:function(result){
if(result.state==SUCCESS){
for(var i=0;i<result.data.length;i++){
if(result.data[i].scope=="body_image"){
$("#body_image").attr("name",result.data[i].id);
alert(result.data[i].id);
}
}
}
}
});
});
function ajaxSubmitForm(form_id, img_id, scope) {
var value = $(img_id).val();
alert(value);
var id=$(img_id).attr("name");
alert(id);
if (!value) {
alert("请先选择文件");
return false;
}
if (!value.match(/.jpg|.jpeg|.jpe|.gif|.png/i)) {
alert("文件格式错误");
return false;
}
var option = {
url : 'file_upload.do',
type : 'POST',
dataType : 'json',
data : {
"scope" : scope,
"filename" : value,
"id":id
},
success : function(result) {
if (result.state == SUCCESS) {
alert(result.data);
}
if (result.state == ERROR) {
alert(result.message) + "--上传失败,请刷新后重试");
}
}
};
$(form_id).ajaxSubmit(option);
return false; //最好返回false，因为如果按钮类型是submit,则表单自己又会提交一次;返回false阻止表单再次提交
}
</script>
</head>
<body>
<div id="administrate" class="administrate">
<div>
<div>
<form action="" id="body_form" method="post" enctype="multipart/form-data">
<input type="file" value="修改网页背景" id="body_image" name=""/>
<input type="button" onclick="ajaxSubmitForm('#body_form','#body_image','body_image')" value="上传"/>
<span>修改整个网页的背景,支持jpg png gif格式</span>
</form>
</div>
</body>
</html>
...全文
请发表友善的回复…
发表回复
Go 旅城通票 2017-03-27
- 打赏
- 举报
而且没意义看，你语法都错了，根本没执行ajax代码走的ajaxSubmit
if (result.state == ERROR) {
alert(result.message) + "--上传失败,请刷新后重试");
}
去掉红色的）
Go 旅城通票 2017-03-27
- 打赏
- 举报
<input type="file" value="修改网页背景" id="body_image" name=""/>
var id=$(img_id).attr("name");
alert(id);
你的ename都没有。。是jquery.form插件吗？是的话就是配置data，没有值自己检查下服务器端
