JavaScript ymPrompt弹窗组件 --父子窗口 获取值 使用实例

<script type="text/javascript">
			//子窗口调用			//打开岗位选择器,默认返回选择的岗位ID和Name
						function openGroupSelector() {
							ymPrompt.win({
										message : '${ctx}/jsp/task/definition/selectStation.jsp',
										width : 600,
										height : 450,
										title : '选择岗位',
										handler : function(msg) {
											if (msg == 'error') {
												//var childDom = ymPrompt.getPage().contentWindow.document;//获取子窗体Document对象
												//selectedGroupId = childDom.getElementById("groupId").value;
												//selectedGroupName = childDom.getElementById("groupName").value;
												//$("#groupId").val(selectedGroupId);
												//$("#groupName").val(selectedGroupName);
												//获取子窗口传递的数据
												alert("id="+$("#groupId").val()+";name="+$("#groupName").val());
											}else if(msg == 'close'){
												
											}
										},
										maxBtn : true,
										minBtn : true,
										closeBtn : true,
										iframe : true
									});
						}
					</script>
//父窗体页面
<input type="text" name="groupName" id="groupName"
						value="${taskDefi.groupId}" style="width:265px;" readonly=true />
						<input type="hidden" name="groupId" id="groupId" value="${taskDefi.groupId}"
						style="width:265px;" /> <input type="button" name="selectGroup"
						value="选择" onclick="openGroupSelector()" />

//子窗体
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/taglibs.jsp"%>
<%
	response.setHeader("Pragma", "No-cache");//HTTP     1.1         
	response.setHeader("Cache-Control", "no-cache");//HTTP     1.0         
	response.setHeader("Expires", "0");//防止被proxy
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../js/common/function.js"></script>
<script type="text/javascript">
	/**加载基础树*/
	function expendAllGroupStations() {
	
		$("#groupTree").jstree({
			plugins : [ "themes", "json_data", "ui"],
			json_data : {
				ajax : {
					url : "expendGroupStationsForUser.do",
					dataType : "json",
					success: function(json){
					},
					error:function(){
						window.parent.parent.ymPrompt.errorInfo('<fmt:message key="user.operation.server.error" />');
					}
				}
			}
		}).bind("select_node.jstree", function(event, data) { //当点击该节点的时候
			var groupId = data.rslt.obj.attr("id");
			var groupName = data.rslt.obj.attr("name");
			var type = data.rslt.obj.attr("type");
			alert("type="+type+";"+(type==1));
			if(type!=1){//只能选择岗位时才赋值
				jQuery("input#groupId").val(groupId);
				jQuery("input#groupName").val(groupName);
			}else{
				jQuery("input#groupId").val("");
				jQuery("input#groupName").val("");
			}
			
		}).bind("remove.jstree", function(e, data) {
		}).bind("loaded.jstree", function(event, data) {
			hidenNotUsedNodes();
			nodeReadOnly();
			jQuery("input#groupId").val("");
			jQuery("input#groupName").val("");
		});
	}
	//设置没有岗位的组织为隐藏
	function hidenNotUsedNodes(){
	      $("#groupTree ul li").each(function(){
	      		//判断是否可以隐藏
	      		if($(this).attr("available")=="false"){
	      			$(this).css("display","none");
	      		}
	      }); 
	}
	//设置树中的组织节点都不能被选中,为只读
	function nodeReadOnly() {
		$("#groupTree ul ").find("li").click(function() {
			if($(this).attr("type")==1){//如果类型为组织
				$(this).removeClass("");
			}
		});
	}
	
     //如果末尾包含prefix,则去掉
    function subVal(val,prefix){
    	var isPrefix = '' + val.substring(val.length-1,val.length);
    	if(isPrefix==prefix){
			val=val.substring(0,val.length-1);
		}
		return val;
	}

	$(document).ready(function() {
		expendAllGroupStations();
	});
	
	/*
	 * 关闭窗口
 	 */
	function closeWindow() {
		window.parent.ymPrompt.doHandler('close',true);
	}
	
	//提交数据到父级页面
	function submitData(){
		var groupId = jQuery("input#groupId").val();
		var groupName = jQuery("input#groupName").val();
		if(groupId.length<1 || groupName.length<1){
			alert("请选择一个岗位!");
			return;
		}
获取父窗口对象		var dom = $(window.parent.document); 		dom.find("#groupId").val(groupId);
		dom.find("#groupName").val(groupName);
		window.parent.ymPrompt.doHandler('error',true);
	}
	
</script>
</head>
<body>

	<form:form id="groupForm">
		<input type="hidden" name="groupId" id="groupId" value="" />
		<input type="hidden" name="groupName" id="groupName" value="" />
		<table style="width: 100%; height:100%;">
			<tr>
				
				<td style="width:80%;">
					<fieldset class="fieldsetStyle">
						<legend>所属岗位</legend>
						<table style="width:100%">
							<tr>
								<div class="scroll sys_tree white" id="groupTree"></div>
							</tr>
						</table>
					</fieldset>
				</td>
			</tr>
			<tr>
				<td style="text-align:right"><input type="button" id="submit"
					class="btn_black" value="提交" onclick="submitData();" /></td>
				<td style="text-align:left"><input id="cancel"
					class="btn_black" type="button" value="取消" onclick="closeWindow();" />
					<!-- /*closeWindow();*/ --></td>
			</tr>
		</table>
	</form:form>
</body>
</html>


你可能感兴趣的:(JavaScript,jquery,json,function,button,themes)