Extjs4.2 window加载HTML,父子页面html传参

2023-01-03 16:53:50 浏览数 (1)

Extjs的窗口是可以加载自己的HTML的,但这样两个页面就相当独立了,传参是个问题 ,网上也没有很好的解答清楚,猫猫今天就说清楚这个模式的传参要点。

一、传参

窗口定义:

代码语言:javascript复制
 var win3 = new Ext.Window({
         id: 'win3',
         width: 800,
         height: 500,
         modal: true,
         closeAction: 'hide', //hide
         title: '选择产品',
         plain: true,
         modal: true, //设置遮罩即只能操作最上层
         html: "<iframe id='openwin' src='Hrproduct_sel.html' scrolling='auto' style='width:100%;height:100%;margin:0;padding:0'></iframe>",
         renderTo: Ext.getBody(),
         defaults: {
             border: false
         }
 });

其中html 中的 src 可以用来传参 src='Hrproduct_sel.html?id=1',

子窗口内的html怎么取得参数呢? getUrlParam可以获取url传参

代码语言:javascript复制
 var id = getUrlParam('id'); //得到传过来的ID
 console.log(id)
 
 function getUrlParam(param) {
 var params = Ext.urlDecode(location.search.substring(1));
 return param ? params[param] : params;
 }

也可以用win3的属性传参,首先要点是要把父页面的窗口id传过来,比如 id是 win3

代码语言:javascript复制
 <iframe id='openwin' src='Hrproduct_sel.html?winid=win3' scrolling='auto' style='width:100%;height:100%;margin:0;padding:0'></iframe>

子窗口内html获取窗口的标题

代码语言:javascript复制
 var winid = getUrlParam('winid'); //得到传过来的ID
 //获取窗口标题
 var objwin = parent.Ext.getCmp(winid);
 console.log(objwin.title)

二、获取返回值

在窗口定义中像id,width 等等都是属性,JS可以随意自己添加(猫猫原来没有理解,后面才知道这么搞,VFP也可以这样搞。),如我添加一个returnVal

代码语言:javascript复制
 var win3 = new Ext.Window({
         id: 'win3',
         returnVal:"",
         width: 800,
         height: 500,
         modal: true,
         closeAction: 'hide', //hide
         title: '选择产品',
         plain: true,
         modal: true, //设置遮罩即只能操作最上层
         html: "<iframe id='openwin' src='Hrproduct_sel.html' scrolling='auto' style='width:100%;height:100%;margin:0;padding:0'></iframe>",
         renderTo: Ext.getBody(),
         defaults: {
             border: false
         }
 });

子页面往win3的returnVal写值

代码语言:javascript复制
 var winid = getUrlParam('winid'); //得到传过来的ID
 var objwin = parent.Ext.getCmp(winid);  
 objwin.returnval="123"

父页面在子窗口hide事件中获取这个值

代码语言:javascript复制
 win3.on("hide",function(){
         console.log("hide");
         console.log(win3.returnval);
 })

这样就可以完成父子页面传参了

0 人点赞