addOrUpdate.jsp

<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="cui" tagdir="/WEB-INF/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<%
	pageContext.setAttribute("idSuffix", String.valueOf(System.currentTimeMillis()).substring(6));
%>
<style type="text/css">
	.form-table tr td, .form-table tr th {
		background-color: white;
		border: 0px solid #4492c3;
	}

	.buttens-foot-tools {
		height: 40px;
		background-color: white;
		text-align: center;
		border-top: 0px solid #a3a3a3;
		padding-top: 7px;
	}

	.form-table tr:nth-child(2n) td, .form-table tr:nth-child(2n) th {
		background-color: white;
	}
</style>
<cui:layout id="layout${idSuffix}" fit="true">
	<cui:layoutRegion region="center">
		<cui:form id="form${idSuffix}" heightStyle="fill" style="padding: 0px;">
			<cui:input name="id" type="hidden"/>
			<table class="form-table" cellpadding="0" cellspacing="0">
				<tr>
					<td colspan="1" align="center"><span class="validate-required">*</span>组名称</td>
					<td colspan="6"><cui:input width="580" id="groupName" name="groupName" required="true"></cui:input></td>
				</tr>
				<tr>
					<td colspan="1" align="center">具体描述</td>
					<td colspan="6">
						<cui:textarea width="580" id="describtion" name="describtion" height="60"></cui:textarea>
					</td>
				</tr>
				<tr>
					<td colspan="1" align="center"><span class="validate-required">*</span>组成员</td>
					<td colspan="3">
						<div style="border:1px solid #999999;overflow: auto;height: 350px;">
							<cui:tree id="orgTree${idSuffix}" asyncUrl="${ctx}/auth/orgTreeData"
												asyncEnable="true" asyncType="get" asyncAutoParam="id,name"
												simpleDataEnable="true" simpleDataIdKey="id" simpleDataPIdKey="parentId"
												onClick="selfDefindeGroup_addOrUpdate_sample.treeOnClick"/>
						</div>
					</td>
					<td colspan="3">
						<div class="depart-selected-main" style="height: 350px;">
							<ul id="yxdw${idSuffix}">
								<!--<li>人大办公室</li>
								<li>政协办公室</li>-->
							</ul>
						</div>
					</td>
				</tr>
				<tr>
					<td colspan="7">
						<div class="buttens-foot-tools" style="background-color: white;">
							<a onclick="selfDefindeGroup_addOrUpdate_sample.sure()">确认</a>
							<a onclick="selfDefindeGroup_addOrUpdate_sample.del()">删除</a>
							<a onclick="selfDefindeGroup_addOrUpdate_sample.clear()">清空</a>
						</div>
					</td>
				</tr>
			</table>
		</cui:form>
	</cui:layoutRegion>
</cui:layout>
<script type="text/javascript">
	var selfDefindeGroup_addOrUpdate_fun = (function (win, $) {
		function sample() {
		}

		var selectDeptArray = [];

		$(function () {
			if ('${buskId}') {
				initLoad();
			}
		});

		var $thisDialog = $('#layout${idSuffix}').closest('.ctrl-init-dialog');
		var $form = $('#form${idSuffix}');
		var $yxdw = $('#yxdw${idSuffix}');

		yxdwLi();

		//加载
		function initLoad() {
			loading('加载中...');
			$.ajax({
				type: 'GET',
				url: '${ctx}/selfDefindeGroup/loadGroupForm?id=${buskId}',
				dataType: 'json',
				success: function (data) {
					hide();
					$form.form('load', data);
					var loadSelectDeptArray = data.groupUser;
					for (var i = 0; i < loadSelectDeptArray.length; i++) {
						var loadDeptId = loadSelectDeptArray[i].deptId;
						var loadDeptName = loadSelectDeptArray[i].deptName;
						selectDeptArray.push({
							deptId: loadDeptId,
							deptName: loadDeptName
						});
						var hh = '';
						hh += '<li data-id="' + loadDeptId + '">' + loadDeptName + '</li>';
						$yxdw.append(hh);
						yxdwLi();
					}
				},
				error: function (e) {
					hide();
					error(e);
				}
			});
		}

		//确定
		sample.prototype.sure = function () {
		    //debugger;
			if (!$form.form('valid')) {
				warning('表单填写不正确！');
				return;
			}
			if(selectDeptArray.length<=0){
                warning('组成员不能为空！');
                return;
            }
			var str = JSON.stringify(selectDeptArray);
			var formData = $form.form('formData');
			formData.groupDepts = str;
			$.ajax({
				type: 'POST',
				url: '${ctx}/selfDefindeGroup/addOrUpdateGroup',
				data: formData,
				dataType: 'json',
				success: function (data) {
					hide();
					if (data.insertSuccess) {
						message('新增成功！');
					} else if (data.updateSuccess) {
						message('更新成功！');
					} else if (data.operateFalse) {
						error("操作失败!")
					}
					selfDefindeGroup_list_sample.reloadGrid();
					closeThisDialog();
				},
				error: function (e) {
					hide();
					error(e);
				}
			});
		}
		//关闭
		sample.prototype.colseD = function () {
			closeThisDialog();
		}

		function closeThisDialog() {
			$thisDialog.dialog('close');
		}

		//已选单位点击事件刷新
		function yxdwLi() {
			$yxdw.find('li').unbind('click').click(function () {
				$(this).toggleClass('active');
			});
			yxsl();
		}

		//已选数量
		function yxsl() {
			<%--$('#yxsl${idSuffix}').html($yxdw.find('li').length);--%>
		}

        function hd(treeNode) {
            console.log(treeNode.children.length);
            for(var i = 0; i < treeNode.children.length; i++){
                if(treeNode.children[i].isParent){
                    hd(treeNode.children[i])
                }else {
                    var hh = '';
                    hh = '<li data-id="' + treeNode.children[i].id + '">' + treeNode.children[i].name + '</li>';
                    $yxdw.append(hh);
                    if(!treeNode.children[i].isParent&&treeNode.children[i].isLastNode){
                        break;
                    }
                }

            }
        }

		sample.prototype.treeOnClick = function (event, id, treeNode) {
			if(treeNode.parentId==null){
                hd(treeNode);
            }
			if (!treeNode.parentId) {
				return;
			}
			var nodes = [];
			if (treeNode.children && treeNode.children.length > 0) {
				//nodes = nodes.concat(treeNode.children);
				nodes = treeNode.children;
			} else {
				nodes = [treeNode];
			}
			//console.log("nodes", nodes);
			for (var i = 0; i < nodes.length; i++) {
				var node = nodes[i];
				var isExist = false;
				$.each(selectDeptArray, function (i, item) {
					if (item.deptId == node.id) {
						isExist = true;
						return false;
					}
				});
				if (isExist) {
					continue;
				}
				selectDeptArray.push({
					deptId: node.id,
					deptName: node.name
				});
				var hh = '';
				hh += '<li data-id="' + node.id + '">' + node.name + '</li>';
				$yxdw.append(hh);
			}
			yxdwLi();
		}

		//清空
		sample.prototype.clear = function () {
			$yxdw.empty();
			selectDeptArray = [];
			yxsl();
		}

		//删除
		sample.prototype.del = function () {
			var $lis = $yxdw.find('li.active');
			$lis.each(function () {
				var deptId = $(this).data('id');
				$.each(selectDeptArray, function (i, item) {
					if (item.deptId == deptId) {
						selectDeptArray.splice(i, 1);
						return false;
					}
				});
			});
			$lis.remove();
			yxsl();
		}

		return sample;
	})(window, $);

	var selfDefindeGroup_addOrUpdate_sample = new selfDefindeGroup_addOrUpdate_fun();
	window['selfDefindeGroup_addOrUpdate_fun'] = null;
	delete window['selfDefindeGroup_addOrUpdate_fun'];
</script>