`
capple84
  • 浏览: 8021 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

jsp checkbox和radio级联控件.

    博客分类:
  • JSP
阅读更多
最近项目需要一个控件,支持动态生成chenkbox,radio。具有默认选中和级联的控件。实现如下:
JSP页面为:
<!--hangyeList、yewuList、yingxiaoList为后台查询各个部门用户集合,用于动态生成radio和checkbox -->
<tr>
					<td align="right" nowrap="nowrap" class="title">
						审批:
					</td>
					<td class="bgcolor_gray">
						<input type="checkbox" name="hangyeCheck" value="checkbox" onclick="return false" checked /><!-- 默认行业处必须选中 -->
						行业处审核
						<% for (int i=0;i< hangyeList.size();i++){ %>
                			<%  SysUser nextUser = (SysUser)hangyeList.get(i); %>
                			<% if(i==0){ %>
                				<input type= "radio"  name= "nextUserNameHangye" checked="true" value= "<%= nextUser.getUserCd()%>" /><%= nextUser.getUserName()%>
                			<%}else{ %>
                				<input type= "radio"  name= "nextUserNameHangye"  value= "<%= nextUser.getUserCd()%>" /><%= nextUser.getUserName()%>
                			<%} %>
                		<%} %>	
                		<br />
						<input type="checkbox" id="yewuCheck" name="yewuCheck" value="checkbox" onclick="checkfunc('yewuCheck','nextUserNameYewu','<%=yewuList.size() %>')" />
						业务管理处审核
						<% for (int i=0;i< yewuList.size();i++){ %>
                			<%  SysUser nextUser = (SysUser)yewuList.get(i); %>
                			<input type= "radio" id="nextUserNameYewu<%=i %>" name= "nextUserNameYewu" value= "<%= nextUser.getUserCd()%>" onclick="radiofunc('yewuCheck','nextUserNameYewu','<%=yewuList.size() %>')"/><%= nextUser.getUserName()%>
                		<%} %>	
                		<br />
						<input type="checkbox" id="yingxiaoCheck" name="yingxiaoCheck" value="checkbox" onclick="checkfunc('yingxiaoCheck','nextUserNameYingxiao','<%=yingxiaoList.size() %>')"/>
						营销服务处审核
						<% for (int i=0;i< yingxiaoList.size();i++){ %>
                			<%  SysUser nextUser = (SysUser)yingxiaoList.get(i); %>
                			<input type= "radio" id="nextUserNameYingxiao<%=i %>" name= "nextUserNameYingxiao" value= "<%= nextUser.getUserCd()%>" onclick="radiofunc('yingxiaoCheck','nextUserNameYingxiao','<%=yingxiaoList.size() %>')"/><%= nextUser.getUserName()%>
                		<%} %>	
                		<br />
					</td>
				</tr>

JS事件为:
<script type="text/javascript">
	/***
	*@note checkbox和radio 级联控件 监听父节点事件 三个传入参数为 #父节点ID名称 #子节点ID民称 #子节点的集合大小
	*@author cuijsh
	*****/
	function checkfunc(check,nextUserName,listSize){
		var yewuCheck = document.getElementById(check);
		var nextUserNameYewu = "";
		if(yewuCheck.checked==true){
			for(var h=0;h<listSize;h++){
				nextUserNameYewu = document.getElementById(nextUserName+h);//用集合的下标来控制选中的是哪一个radio
				if(h==0) nextUserNameYewu.checked = true;
			}
		}else{
			for(var h=0;h<listSize;h++){
				nextUserNameYewu = document.getElementById(nextUserName+h);
				nextUserNameYewu.checked = false;
			}
		}
	}
	/***
	*@note checkbox和radio 级联控件 监听子节点事件 三个传入参数为 #父节点ID名称 #子节点ID民称 #子节点的集合大小
	*@author cuijsh
	*****/
	function radiofunc(check,nextUserName,listSize){
		var yewuCheck = document.getElementById(check);
		var nextUserNameYewu = "";
		for(var h=0;h<listSize;h++){
			nextUserNameYewu = document.getElementById(nextUserName+h);
			if(nextUserNameYewu.checked == true) yewuCheck.checked = true;
		}
	}
</script>
分享到:
评论

相关推荐

    带CheckBox和级联操作的Tree

    带CheckBox和级联操作的Tree 带CheckBox和级联操作的Tree 带CheckBox和级联操作的Tree

    Flex tree+checkbox可实现级联勾选 修改

    checkBox.selected = true; } else if (state == STATE_UNCHECKED) { checkBox.selected = false; } else if (state == STATE_SCHRODINGER) { checkBox.selected = false; }else{ checkBox.selected = false; } ...

    Android 开灯 关灯 checkbox Radio组件用法演示.rar

    Android 开灯 关灯 checkbox Radio组件用法演示,向大家展示了如何为CheckBox和RadioButton添加监听器及开关灯业务代码,通过单击不同的按钮,切换开灯图片和关灯图片,设置程序操作状态如下:  public void ...

    019_UI_常用组件-BasicViews-button-checkbox-radio

    在Android UI设计中,BasicViews是一组基础的视图组件,包括按钮(Button)、复选框(Checkbox)和单选按钮(Radio Button),这些都是构建用户界面不可或缺的部分。本教程“019_UI_常用组件-BasicViews-button-...

    外观时尚的纯CSS3美化Checkbox和Radiobox按钮源码.zip

    外观时尚的纯CSS3美化Checkbox和Radiobox按钮源码.zip 外观时尚的纯CSS3美化Checkbox和Radiobox按钮源码.zip 外观时尚的纯CSS3美化Checkbox和Radiobox按钮源码.zip

    Delphi动态创建和载入CheckBox控件.rar

    在Delphi编程环境中,动态创建和载入CheckBox控件是一项基本但重要的技能,尤其是在构建复杂的用户界面时。这个示例项目“Delphi动态创建和载入CheckBox控件”旨在帮助初学者理解如何在运行时根据需求创建控件,并且...

    HTML5 CheckBox Radio按钮美化特效.rar

    基于jquery HTML5 CheckBox Radio按钮美化特效,演示了不一样的checkbox和Radiobox,加入了点击动画效果,鼠标点击后选中状态也是与默认的风格不一样,如截图所示的为本款效果,更多详情细节请下载本示例自己测试...

    jsp实现checkbox的ajax传值实例.docx

    在`up-ajx.jsp`中,你可以使用以下代码来获取和处理传递的复选框值: ```java String[] atitles = request.getParameterValues("atitle"); if (atitles != null) { for (String atitle : atitles) { // 对每个...

    PyPI 官网下载 | checkbox-ng-0.1.tar.gz

    "checkbox-ng-0.1.tar.gz"是这个包的文件名,它遵循了Python包常见的命名规范,由项目名(checkbox-ng)和版本号(0.1)组成,并以.tar.gz为后缀,意味着它是用tar工具打包并经过gzip压缩的文件。 描述中的"资源...

    ExpandAbleListView+checkbox数组方式级联,点击选择顶部文本显示,可删除

    ExpandAbleListView+checkbox数组方式级联,外层列表可展开收起,内层列表使用checkbox多选框,点击之后可在顶部的gridlayout显示,顶部显示的选中与checkbox选中状态关联,点击顶部选中的item,可取消选中状态,...

    Android-拥有三种状态纯Material风格的AndroidCheckbox控件

    本文将深入探讨如何实现一个具有三种状态的纯Material风格的Android Checkbox控件,以及与之相关的Android开发知识。 Checkbox在Android中通常用于提供多选选项,它的默认状态只有两种:选中和未选中。然而,有时...

    JQuery操作checkbox、radio等示例

    本篇文章将深入探讨如何使用jQuery来操作checkbox和radio元素,这两种元素在表单提交和用户交互中扮演着重要角色。 首先,让我们了解checkbox和radio的基本概念。Checkbox用于提供多选选项,用户可以勾选多个选项;...

    兼容IE8的CSS Checkbox和Radio美化插件

    checkbox_radio.css是一款用于美化Checkbox和Radio控件的CSS小插件。通过checkbox_radio提供的样式,你可以生成基于bootstrap,或字体图标,或图片的Checkbox和Radio美化样式。

    vs2008演示CheckBox复选框控件的使用实例

    本文将深入探讨CheckBox控件的使用,包括其基本属性、事件和方法,以及如何在实际项目中应用。 1. **基本属性**: - `Text`:显示在CheckBox旁边的文本,通常用来描述该选项的内容。 - `Checked`:指示CheckBox...

    精英stm32f103开发板CHECKBOX小工具.zip.zip

    精英stm32f103开发板CHECKBOX小工具.zip.zip

    《Android开发视频教程》第十二集:CheckBox复选框控件使用.zip

    《Android开发视频教程》第十二集:CheckBox复选框控件使用.zip

    jsp中checkbox用法详解.docx

    - **ASP.NET服务器端控件**:在ASP.NET中,也提供了类似于`RadioButtonList`、`DropDownList`和`CheckBoxList`这样的服务器端控件,它们可以提供更丰富的功能和更好的用户体验。 - **jQuery中`:checkbox`选择器**:...

    Android CheckBox与监听Demo源码.rar

    checkBox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { if (isChecked) { // 复选框...

    纯CSS美化input radio checkbox样式.zip

    综上所述,这个“纯CSS美化input radio checkbox样式.zip”资源提供了一套完整的解决方案,通过纯CSS3技术对input的radio和checkbox进行美化,让网页的交互元素更加美观、一致且符合现代设计趋势。设计师和开发者...

Global site tag (gtag.js) - Google Analytics