批量添加前臺js校驗惟一性,前臺批量循環添加name【0】後臺集合獲取

/*************************初始化添加*************************************/javascript

<script type="text/javascript">html

//維護刪除數組中的某一項java

Array.prototype.remove = function(val) {
var index = this.indexOf(val);
if (index > -1) {
this.splice(index, 1);
}
};
//array.remove('1');
//ajax從數據庫模擬查出來的數據
var array=new Array(1,2,3,4);
var insertarr="";
var input=$("input[name=bbh]");
$(function(){
for(var i=0;i<input.length;i++){
//定位input
$("input:eq("+i+")").attr("index",i);
//改變的時候進行驗證
$("input:eq("+i+")").on("change", function() {
var inputval=$(this).val();
//var inputindex=$(this).attr("index");
if($.inArray(inputval, array)=='-1'){//若是不包含在數組中,則返回 -1;
insertarr=inputval;
}else{
alert("請從新填寫")
//$("input:eq("+inputindex+")").val("");
//$("input:eq("+inputindex+")").focus();
$(this).val("");
insertarr="";
}
if(insertarr!=null&&insertarr!=""){
array.push(insertarr);
}
//改變的同時刪除數組中的值維護一個數組
if($("#jl").val()!=""&&insertarr!=$("#jl").val()){
array.remove($("#jl").val());
}
});
//獲取焦點的時候進行驗證
$("input:eq("+i+")").on("focus", function() {
var inputval=$(this).val();
$("#jl").val(inputval)
});
}
})ajax




</script>
</head>
<body>
<center>
記錄:
<input type="text" name="lishival" value="" id="jl">
<br/>
<input type="text" class="yz" value=""> <br/>
<input type="text" class="yz" value=""> <br/>
<input type="text" class="yz" value=""> <br/>
<input type="text" class="yz" value=""> <br/>
<input type="text" class="yz" value=""> <br/>
</center>數據庫

</body>json

 

------------------------------------layui批量添加時------------------------------數組

<form class="layui-form" id="addform" method="post" action="bb/doaddBdBbs"> app


<center>
<table border="1" bordercolor="#a0c6e5"
style="border-collapse:collapse;margin: 0px 3px 0px 3px;">
<tr align="center" style="height: 35px;">less

<td style="width: 167px;">包號</td>
<td style="width: 167px;">包名稱</td>
<td style="width: 167px;">備註</td>
<td style="width: 7%;"><img src='static/images/add.png' style='cursor: pointer;' title='添加' onclick="append();" /> </td>
</tr>
post

<tbody id="append">
<tr>
<td><input type="text" name="bbh" onfocus="bbonfocus(this)" onchange="bbchange(this)" lay-verify="required|number" autocomplete="off" class="layui-input"></td>
<td><input type="text" name="bbmc" lay-verify="required" autocomplete="off" class="layui-input" maxlength="64"></td>
<td><input type="text" name="bz" lay-verify="" autocomplete="off" class="layui-input"></td>
<td style="text-align: center;"></td>

</tr>
</tbody>
</table>
</center>
<br/>
<div class="layui-form-item">
<div class="layui-input-block">
<button id="enterSubmit" class="layui-btn" lay-submit lay-filter="formSubmit" >當即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>

 

//維護刪除數組中的某一項
var array=new Array();
Array.prototype.remove = function(val) { 
var index = this.indexOf(val); 
if (index > -1) { 
this.splice(index, 1); 

};

$(function(){
$.post("bb/bbhs/${fbh}",{},function(data){
for(var i=0;i<data.length;i++){
if(data[i]['lx']==2){
array.push(data[i]['bbh'])
}
}
})
})


var insertarr="";
function bbchange(obj){
var inputval=$(obj).val();
if($.inArray(inputval, array)=='-1'){ 
insertarr=inputval;
}else{
alert("該包號存在請從新填寫") 
$(obj).val("");
array.remove($("#jl").val());此處存在小小bug已解決。上邊是直接初始化。獲取焦點後記錄裏的值居然清空了因此在清空獲取焦點以前把記錄項刪除
$(obj).focus(); 
insertarr="";
}
if(insertarr!=null&&insertarr!=""){
array.push(insertarr);
}
if(insertarr!=$("#jl").val()){
array.remove($("#jl").val());
}
}

function bbonfocus(obj){
var inputval=$(obj).val(); 
$("#jl").val(inputval) 
}

 

function append(){
var tr=$("#append>tr:eq(0)").clone(true);
var input0=tr.find("td>input:eq(0)").val("");
input0.attr({onfocus:"bbonfocus(this)", onchange:"bbchange(this)"})
var input1=tr.find("td>input:eq(1)").val("");
var input2=tr.find("td>input:eq(2)").val("");
var input3=tr.find("td:last").html("<img src=\"static/images/delete.png\" style=\"cursor: pointer;\" onclick=\"del(this);\" title=\"刪除\"/>");
$("#append").append(tr)
}
submitForm("#addform",function(data){
if(data.result=="success"){
parent.loadCount();
closeIframe();
alert(data.msg);
}
});
function del(obj){
$(obj).parent().parent().remove();
}

 

 

 

 

<table border="1" bordercolor="#a0c6e5"
style="border-collapse:collapse;margin-left: 20%;">
<tr align="center" style="height: 35px;" >
<td>項目名稱</td>
<td>內容</td>
<td>時長</td>
<td style="width: 7%;"><img src='static/images/add.png' style='cursor: pointer;' title='添加' onclick="append();" /> </td>
</tr>

<tbody id="append">
<tr>
<td><input type="text" name="bbh" onfocus="bbonfocus(this)" onchange="bbchange(this)" lay-verify="required" autocomplete="off" class="layui-input"></td>
<td><input type="text" name="bbmc" lay-verify="required" autocomplete="off" class="layui-input" maxlength="64"></td>
<td><input type="text" name="bz" lay-verify="" autocomplete="off" class="layui-input"></td>
<td style="text-align: center;"></td>

</tr>
</tbody>
</table>

 

function append(){
var tr=$("#append>tr:eq(0)").clone(true);
var input0=tr.find("td>input:eq(0)").val("");
input0.attr({onfocus:"bbonfocus(this)", onchange:"bbchange(this)"})
var input1=tr.find("td>input:eq(1)").val("");
var input2=tr.find("td>input:eq(2)").val("");
var input3=tr.find("td:last").html("<img src=\"static/images/delete.png\" style=\"cursor: pointer;\" onclick=\"del(this);\" title=\"刪除\"/>");
$("#append").append(tr)
}
function del(obj){
$(obj).parent().parent().remove();
}

 

/********************checkbox和input混合批量添加***********************************/

function sub() {
var i = 0;
var divArr = $("#Form .div");
$.each(divArr, function(i, n) {
var input = $(this).find("input:eq(0)");
var input1 = $(this).find("input:eq(1)");
var input2 = $(this).find("input:eq(2)");
var input3 = $(this).find("input:eq(3)");
var input4 = $(this).find("input:eq(4)");
var input5 = $(this).find("input:eq(5)");
$(input).attr("name", "h[" + i + "].name");
$(input1).attr("name", "h[" + i + "].happyAll");
$(input2).attr("name", "h[" + i + "].happyAll");
$(input3).attr("name", "h[" + i + "].happyAll");
$(input4).attr("name", "h[" + i + "].happyAll");
$(input5).attr("name", "h[" + i + "].happyAll");

});
//表單提交
//alert($("#Form").html())
document.Form.action = "${pageContext.request.contextPath}/happy/oneSave.do";
document.Form.submit();

/* $.ajax({
url : "${pageContext.request.contextPath}/happy/oneSave.do",
data : $("#Form").serialize(),
dataType : "json",
type : "post",
success : function(res) {
for(var i=0;i<res.list.length;i++){
$("input[value='"+res.list[i]+"']").prop("checked",true);

}

}
})
*/
}

<h3>給予多選框一個字段提交</h3>
<form id="Form" name="Form" action="" method="post">

<div class="div">
名字 <input type="text" name="name">
娛樂 <input type="checkbox" name="hobby" value="1">
游泳 <input type="checkbox" name="hobby" value="2">
健身 <input type="checkbox" name="hobby" value="3">
看報 <input type="checkbox" name="hobby" value="4">
讀書 <input type="checkbox" name="hobby" value="5">

</div>

 

<br />
<div class="div">
名字 <input type="text" name="name">
娛樂 <input type="checkbox" name="hobby" value="1">
游泳 <input type="checkbox" name="hobby" value="2">
健身 <input type="checkbox" name="hobby" value="3">
看報 <input type="checkbox" name="hobby" value="4">
讀書 <input type="checkbox" name="hobby" value="5">

</div>
<br />


<input type="button" value="提交" onclick="sub();" />
</form>

 

 

 

 /***************針對一個文本框校驗是否重複***********************/

var lessonName=new Array();
$.each($("input[name='project_code']"),function(i,n){
lessonName.push(n.value);
})
var repeatName="";
var hash = {};
for(var i=0;i<lessonName.length;i++){
if(!hash[lessonName[i]])
{

//不重複
hash[lessonName[i]]=true;
}
else{

//重複 repeatName+=lessonName[i]+"、"; } } if(repeatName!=""){ alert("項目名稱存在重複!"); return false; } $.ajax({ url:"work_log/doAdd", data:$("#addform").serialize(), dataType:"json", type:"POST", success:function(data){ },error:function(r){ } }) });

相關文章
相關標籤/搜索