朋友需求,让我做JQ 动态验证。之前用了这个
$("#ulFile").validate({
rules : {
upload1 : {
required : true
},
upload2 : {
required : true
},
upload3 : {
required : true
}
},
messages : {
upload1 : {
required : "<font color='red'>请选择文件</font>"
},
upload2 : {
required : "<font color='red'>请填写密码</font>"
},
upload3 : {
required : "<font color='red'>请选择文件</font>"
}
}
});
不过struts要求name一样。JQ则要求不一样。我本想着在提交前改name为统一值,但是捕捉不到那一刻。想改JQ源码,但是无奈能力问题。所以最后写成了下面这样子,勉强用着吧。
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="comm/js/jquery-1.7.js" type="text/javascript"></script>
<link rel="stylesheet" href="comm/css/validationEngine.jquery.css" type="text/css" media="screen" title="no title" charset="utf-8" />
<link rel="stylesheet" href="comm/css/template.css" type="text/css" media="screen" title="no title" charset="utf-8" />
<script src="comm/js/jquery.validate.min.js" type="text/javascript"></script>
<title>upload</title>
<script type="text/javascript">
/*菜鸟思路:根据得到文件路径来判断是否选择文件,所以设置了前面路径文本框为不可写入。
如果设置成写入还需要判断文件存不存在,更加麻烦。
*/
$(document).ready(function(){
$("#add").click(function(){
var tmp = $(":file").size()+1;
var html = "<tr>"+
"<td class='tdLabel'>"+
"<label for='"+tmp+"' class='label'>"+tmp+"\:</label>"+
"</td>"+
"<td>"+
"<input type='file'name='upload'id='"+tmp+"'>"+
"</td>"+
"<td>"+
"<span id = 'span"+tmp+"'style = 'color:red'></span>"+
"</td>"+
"</tr>";
$("#wwFormTable tbody").append(html);
});
$("#sub").click(function(){
var size = $(":file").size();
var boo = true;
var num = 0;
var reg = /^\s*$/;
for ( var i = 1; i <= size ; i++) {
var tmpValue = document.getElementById(i+"").value;
if(reg.test(tmpValue)){
$("#span"+i+"").html("请选择文件!!");
}else{
$("#span"+i+"").html("");
num = num + 1
}
}
if(num != size){
boo = false;
}
if(boo){
document.ulFile.submit();
}
})
});
</script>
</head>
<body>
<h1>批量上传文件</h1>
<button id ='add'>增加文件上传对话框</button>
<s:form action ="action!doUpload.action" method ="POST" enctype ="multipart/form-data" id ="ulFile">
<table id="wwFormTable">
<tbody>
<tr>
<td class="tdLabel"><label for="1" class="label">1:</label></td>
<td><input type="file" name="upload" value="" id="1" onkeydown="return false" onpaste="return false" ></td>
<td><span id="span1" style="color:red"></span></td>
</tr>
<tr>
<td class="tdLabel"><label for="2" class="label">2:</label></td>
<td><input type="file" name="upload" value="" id="2" onkeydown="return false" onpaste="return false" ></td>
<td><span id="span2" style="color:red"></span></td>
</tr>
<tr>
<td class="tdLabel"><label for="3" class="label">3:</label></td>
<td><input type="file" name="upload" value="" id="3" onkeydown="return false" onpaste="return false" ></td>
<td><span id="span3" style="color:red"></span></td>
</tr>
</tbody>
</table>
</s:form >
<button id="sub" >差不多了,提交。</button>
</body>
</html>
来源:https://www.cnblogs.com/bin-pureLife/p/struts2_JQ.html