jsp页面modalDialog之间如何传值

最新推荐文章于 2021-04-02 21:04:12 发布

遥啊遥

最新推荐文章于 2021-04-02 21:04:12 发布

阅读量2.8k

点赞数

本文链接：https://blog.csdn.net/qq_38362772/article/details/84865546

版权

我的前台是基于easyUI和jQuery写的，但原理都类似

一，父窗口向子窗口传值

用modalDialog模态框可以在原有的页面上显示一个弹窗，弹窗内容则写在另一个页面上

父jsp页面的js代码如下：

localStorage.hel = $('#P_SMS_ALARM_DXM_TXT').val();
var dialog = parent.sy.modalDialog({
		title : '发送测试短信',
	 	url : '<%=contextPath%>/sms/sendTestParam.jsp?type='+$('#P_SMS_SEND_TYPE').val(),
		width:'415',
		height:'220',
		buttons : [{
			text : '点击发送',
			handler : function(value){
				var d = dialog.find('iframe').get(0).contentWindow;
				var type = $('#P_SMS_SEND_TYPE').val();
				var phone = $("#phone",d.document).val();
				var message = $("#message",d.document).val();
				var str = "";
				var url = '<%=contextPath %>/sendMessageController/sendMessageTest__noSecurity';
				$("#params").val(getParamStr());
				str = getParamStr()+"@P_SMS_PHONE;"+phone+"@P_SMS_MESSAGE;"+message;
				if(phone == "" || message== ""){
					$.messager.alert("提示框","<br/><br/>短信内容或手机号码不为空!","info");
				}else{
	        		$.post(url, {params:str,type:type}, function(result) {	
						dialog.dialog('destroy');
						if (result.success) {
							$.messager.show({
								title : "发送测试短信",
								msg : "发送成功"
							}); 
						} else { 
							$.messager.alert('提示',"发送失败 ", 'error');
						}
					}, 'json');
	        	}
			}
		}] 
	});

子jsp页面要做一个短信发送窗口，内容如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
	String type =  request.getParameter("type");
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<jsp:include page="../inc.jsp"></jsp:include>
<title>发送测试短信</title>
<script type="text/javascript">
	$(function(){
		var type = <%= type %>;
		var txt=localStorage.hel;
		if (type == 1) {
			$('#message').prop('readonly','readonly');
			$('#message').css('background','#f4f4f4');
			$('#message').val(txt);
		}
		
		//验证手机号
		var regPhone = /^1(3|4|5|7|8)\d{9}$/ ;
		$.extend($.fn.validatebox.defaults.rules, { 
			phone: { 
			validator: function(value,param){ 
				return regPhone.test(value); 
			}, 
				message: '手机号码输入有误!' 
			} 
		});
	});
</script>
</head>
<body>
	<div style="padding-top: 3px;padding-left: 15px;">
	<form method="post" class="form">
		<table>
		<tr>
		 	 <td>短信文本：</td>
		 	 <td><textarea cols="29" rows="4" id="message" style="resize:none"></textarea></td>
		</tr>
		<tr><td><br/></td></tr>
		<tr style="padding-top: 3px">
		  	<td>电话号码：</td>
		 	<td><input id="phone" data-options="validType:'phone'" class="easyui-validatebox" style="width: 194px;height: 24px"></td>
		</tr>
		</table>
	</form>
</div>
</body>
</html>

我要传的参数一个是type，一个是txt

type直接在父页面获取到值之后，直接写在url后面，在子页面head之前request.getParameter("type")获取到

但是我要获取的txt文本太长，而modalDialog默认提交方式为get,所以，既然这个模态框是一个单独的jsp页面，因此可以通过localStorage来传参。

二，父窗口获取子窗口元素

//先获取子窗口
var contentWindow = dialog.find('iframe').get(0).contentWindow;
//直接调用子窗口的元素
var calDate=contentWindow.$("#calDate").val();

遥啊遥

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jsp页面modalDialog之间如何传值

我的前台是基于easyUI和jQuery写的，但原理都类似一，父窗口向子窗口传值用modalDialog模态框可以在原有的页面上显示一个弹窗，弹窗内容则写在另一个页面上父jsp页面的js代码如下：localStorage.hel = $('#P_SMS_ALARM_DXM_TXT').val();var dialog = parent.sy.modalDialog({ ti...
复制链接

扫一扫