1. 程式人生 > >js中將多個checkbox的值傳處理並傳到後臺

js中將多個checkbox的值傳處理並傳到後臺

前臺的東西也需要引起重視,在日常開發中覺得有必要做筆記的就總結記下,日後用到便於查詢。

jsp頁面程式碼如:

<c:forEach items="${obj.rows}" var="list" varStatus="row" >
    <tr>
	<td align="center">
		<c:if test="${list.shareType eq '0'}">
			<input type="checkbox" disabled="disabled"/>
		</c:if>
		<c:if test="${list.shareType eq '1' || list.shareType eq '2'}">
			<input type="checkbox" name="apiContent" value="${list.fieldCode}"/>
		</c:if>
	</td>
	<td align="center">${list.fieldName}</td>
	<td align="center">
		<c:if test="${list.shareType eq '0'}">不共享</c:if>
		<c:if test="${list.shareType eq '1'}">普通共享</c:if>
		<c:if test="${list.shareType eq '2'}">按需共享</c:if>
	</td>
   </tr>
</c:forEach>
在迴圈列出的所有資源項中,將勾選的checkbox的值拼接成字串傳到後臺:
function nextStep(){
	var box = document.getElementsByName("apiContent");
	var objArray = box.length;
	var apiContentStr="";
	
	for(var i=0;i<objArray;i++){
		if(box[i].checked == true){
			apiContentStr += box[i].value+",";
		} 
	}
	if(apiContentStr == "" || apiContentStr.length == 0){
		alert("請勾選需要的資源項!");
		return;
	}
	apiContentStr = apiContentStr.substring(0, apiContentStr.length-1);
	
	$('#MainForm').attr('action', '${ctx}/api/toEditApply?apiContentStr='+apiContentStr);
	$('#MainForm').submit();
	
}



附加內容:校驗複選框,並ajax修改標記。

//提交稽核
function tijiaoCheck(applyBatch){
	if($("input[type='checkbox']").is(':checked')){
		alert("確定同意該協議!");
		$.post("${ctx}/api/submit?applyBatch="+applyBatch,
			{ Action: "post"},
			function(data, textStatus){
			 data = eval('('+data+')');
			 if(data == '1'){
			     alert("提交成功!");
			     $('#MainForm').attr('action', '${ctx}/api/reloadAgreement?applyBatch='+applyBatch);
				$('#MainForm').submit();
			  }else{
			     alert("提交失敗!");
					}
			});
	}else{ 
		alert("是否閱讀並同意該協議!");
		
	}
}


<div style="height:20px;padding-top: 5px;text-align: center">
	<c:if test="${obj.apiApply.isSubmit != '1'}">
		<input type="checkbox" id="xieyibox"/>已閱讀協議並同意協議條款
	</c:if>
</div>

做過了總得有必要記錄下來,這就是學習筆記了。