树列复选框Extjs
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="s" uri="/struts-tags" %> <%String webapp = request.getContextPath();%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <META HTTP-EQUIV='Expires' CONTENT='0'> <META HTTP-EQUIV='pragma' CONTENT='no-cache'> <META HTTP-EQUIV='Cache-Control' CONTENT='no-cache, must-revalidate'> <link href="<%=webapp%>/skin/common.css" rel="stylesheet" type="text/css"> <jsp:include page="../extInclude.jsp" /> <script type="text/javascript" src="<%=webapp%>/resource/js/jquery-1.8.3.js"></script> <SCRIPT language="javascript" src="<%=webapp%>/resource/js/common.js"></SCRIPT> <script type="text/javascript" src="<%=webapp%>/resource/js/configAgency.js"></script> <SCRIPT type="text/javascript"> $(document).ready(function() { var cityId = $("#cityId").val(); var cityName = $("#cityName").val(); var e1= document.myform.list2 ; if(cityId!=""){ nid=cityId.split(","); nam=cityName.split(","); for(i = 0; i < nid.length-1; i++){ e1.options.add(new Option(nam[i],nid[i])); } } }); //添加待选机构 function TaskAgencySelected(){ var deptIds=Ext.getCmp('treePanelId').getChecked(); var deptId=""; var deptName=""; var e1= document.myform.list2 ; if(deptIds.length > 0){ for(i = 0; i < deptIds.length; i++){ deptId += deptIds[i].id + ","; deptName+=deptIds[i].text + ","; if(e1.options.length>0){ for(var j=0;j<e1.options.length;j++){ if(e1.options[j].value ==deptIds[i].id){ e1.remove(j); } } } e1.options.add(new Option(deptIds[i].text ,deptIds[i].id)); } document.myform.cityId.value=getvalue(document.myform.list2); document.myform.cityName.value=gettext(document.myform.list2); } else{ Ext.MessageBox.alert("提示","请选择您要添加的金融机构部门!"); } } // 删除已选机构部门 function moveOption(e1){ try{ for(var i=0;i<e1.options.length;i++){ if(e1.options[i].selected){ e1.remove(i); i=i-1 } } document.myform.cityId.value=getvalue(document.myform.list2); document.myform.cityName.value=gettext(document.myform.list2); } catch(e){} } // 将获取的机构id值 用逗号串起来 function getvalue(geto){ var allvalue = ""; for(var i=0;i<geto.options.length;i++){ allvalue +=geto.options[i].value + ","; } return allvalue; } //将获取的机构名称值,用逗号串起来 function gettext(geto){ var alltext=""; for(var i=0;i<geto.options.length;i++){ alltext+=geto.options[i].text + ","; } return alltext; } // 保存 function saveClick(){ var cityId = $('#cityId').val(); var cityName = $('#cityName').val(); window.opener.document.getElementById("departmentName").value =cityName ; window.opener.document.getElementById("departmentId").value = cityId ; window.close(); } //返回 function quit(){ var result = window.confirm('确认要退出吗?'); if(result){ window.close(); } } </SCRIPT> </head> <body scroll=no> <div> <s:component template="extButton.ftl"> <s:param name="buttons" value="%{' {text:\"保存\",iconCls:\"saveImg\",handler:saveClick}, {text:\"返回\",iconCls:\"backImg\",handler:quit} '}"/> </s:component> </div> <table cellspacing=0 cellpadding=0 border="0" width=100% height=100%> <tr height=11> <td > <!-- 位置栏 --> <div class="location_bg"><img src="<%=webapp%>/resource/images/icon/icon_1.gif" align="absmiddle" /> 您的位置 >> 信息管理 >> 栏目管理 >> <span>配置金融机构</span></div> </td> </tr> <tr height=100%> <td > <!--内容区域--> <div class="contentBlock"> <form name="myform"> <table cellspacing=0 cellpadding=0 width="100%" height="100%" border="0"> <input id="menucode" name="menucode" type="hidden" value="<%=request.getParameter("menucode") %>"/> <tr height="28"> <td width="450"> <div style="width: 450px;height:28px;" class="location_bg"><img src="<%=webapp%>/resource/images/icon/icon_1.gif" align="absmiddle" />待选机构 </td> <td rowspan="2" width="50" style="background-color: #dfdfdf;" align="center"> <div align="center" style="margin-top: 15px;"> <input type="button" class="input_button" onclick="TaskAgencySelected()" value="添加" align="absmiddle" /> </div> <div style="margin-top: 15px;"> <input type="button" class="input_button" onclick="moveOption(document.myform.list2)" value="删除"/> </div> </td> <td valign="top" rowspan="2"> <!-- 位置栏 --> <div style="width: 100%;" class="location_bg"><img src="<%=webapp%>/resource/images/icon/icon_1.gif" align="absmiddle" /> 已选金融机构 </div> <select style="width:100%;" multiple name="list2" size="20" ondblclick="moveOption(document.myform.list2)"> </select> <input id="cityId" type="hidden" value="<s:property value="cityId" />"/> <input id="cityName" type="hidden" value="<s:property value="cityName" />" /> </td> </tr> <tr> <td width="450" colspan="2"> <div id="agencyTeamDiv" style="height:100%;display: none;"></div> <div id='deptTreeDiv' style="height:100%"></div> </td> </tr> </table> </form> </div> </td> </tr> </table> <s:component template="extTree.ftl"> <s:param name="renderTo" value="%{'deptTreeDiv'}"/> <s:param name="treePanelId" value="%{'treePanelId'}"/> <s:param name="dataUrl" value="%{'task_loadAgencyJson.action?menucode='+#request.menucode}"/> //j 机构树加载 action <s:param name="treeWidth" value="%{'450'}"/> <s:param name="treeHeight" value="%{'452'}"/> <s:param name="onlyLeafCheckable" value="%{'false'}"/> <s:param name="rootId" value="%{'-1'}"/> <s:param name="async" value="%{'true'}"/> </s:component> </body> </html>
2013-10-16