js实现两多选框值移动

最新推荐文章于 2017-12-04 15:32:00 发布

iteye_10047

最新推荐文章于 2017-12-04 15:32:00 发布

阅读量177

点赞数

分类专栏： JavaScript 文章标签： javascript ViewUI

本文链接：https://blog.csdn.net/iteye_10047/article/details/82371926

版权

JavaScript 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

js代码


<script type="text/javascript">
  		function MoveAll(FromList,ToList){
			for(var i=0;i<FromList.length;i++){
					ToList[ToList.length] = new Option(FromList.options[i].text,FromList.options[i].value);
			}
			FromList.length=0;
		}

		function MoveSelection(FromList,ToList){
			for(var i=0;i<FromList.length;i++){
				if(FromList.options[i].selected){
					ToList[ToList.length] = new Option(FromList.options[i].text,FromList.options[i].value);
				}
			}
			for(i=FromList.length-1;i>=0;i--){
				if(FromList.options[i].selected)FromList.remove(i);
			}
		}
		function checkAll(floorIds){
			for(var i=0;i<floorIds.length;i++){
				floorIds.options[i].selected = true;
			}

			var storageCodeStr = document.forms[0].storageCode.value;
			if(storageCodeStr == "") {
				alert("请选择仓库！");
				return false;
			}
			if(floorIds.length<1) {
				alert("请选择楼层！");
				return false;
			}
		}
</script>

jsp代码


<s:form action="saveFloorStore"
			onsubmit="return checkAll(this.floorIds);">
			<table width="100%">
				<tr>
					<td>
						仓库名称：					
					</td>
					<td colspan="3">
						<s:select list="#storageNames" name="storageCode"
							listKey="dicCode" listValue="dicName" label="仓库名称" headerKey="" headerValue="" onchange="addSelectFloor();"/>				
					</td>
				</tr>
				<tr>
					<td rowspan="2">
						楼层信息：					
					</td>
					<td>
						已有楼层					
					</td>
					<td rowspan="2">					
						<input  type="button"
							onClick="MoveSelection(this.form.right,this.form.floorIds)"
							value="<< 添 加"/>
						<br>
						<input  type="button"
							onClick="MoveAll(this.form.right,this.form.floorIds)"
							value="<< 全部添加"/>
						<br>
						<input  type="button"
							onClick="MoveSelection(this.form.floorIds,this.form.right)"
							value="删 除 >>"/>
						<br>
						<input  type="button"
							onClick="MoveAll(this.form.floorIds,this.form.right)"
							value="全部删除 >>"/>					
					</td>
					<td>
						系统默认楼层集合					
					</td>
				</tr>
				<tr>
					<td>
						<select name="floorIds" id="floorIds" size="10" multiple="multiple"
							style="width: 180"
							ondblclick="MoveSelection(this.form.floorIds,this.form.right)">
							<s:iterator value="#request.haveFloor" id="haveFloor">
								<option value="${haveFloor.dicCode }">
									${haveFloor.dicName }								
								</option>
							</s:iterator>
						</select>					
					</td>
					<td>
						<select name="right" size="10" multiple="multiple"
							style="width: 180"
							ondblclick="MoveSelection(this.form.right,this.form.floorIds)">
							<s:iterator value="#request.floor" id="storeFloor">
								<option value="${storeFloor.dicCode }">
									${storeFloor.dicName }
								</option>
							</s:iterator>
						</select>
					</td>
				</tr>
				<tr>
					<td>
						 
					</td>
					<td>
						<s:submit value="下一步"/>
						   
						<!-- <input type="button" value="返 回" onclick="history.back();"/>	 -->				
					</td>
				</tr>
			</table>
		</s:form>