showModalDialog()向子窗口传自定义参数(javascript提取url参数)及其他

解决JS回填难题
本文描述了一位开发者如何解决两个不同页面调用同一查询页面后回填信息的问题,通过增加参数实现灵活配置。

事情是这样子的。

今天下午我正刷果壳刷得不亦乐乎,突然需求就下来了。

它!就!这!么!下!来!了!

172426_RKSE_1040430.jpg

客户说,我们需要打开一个新窗口来进行模糊查询,然后选择一个查询结果回填到父窗口中。

valy easy。

173255_BSQB_1040430.jpg

然后我发现那个模糊查询的页面叫agentSearch.jsp

里面的内容是这样的

function backfill(){
    var val = document.getElementById("agentsearch").value;
    var parWin = window.dialogArguments;
    parWin.document.getElementById(" ").value = val;			
    window.close();
}

咦为什么getElementById参数会是空的呢

不管了可能是上一个人没写完吧,那就让我来完成它!!!

174710_rSBp_1040430.jpg

有两个页面调用过它

createsettlementmanage_search.jsp

commissionsettlement.jsp

可能这两个页面需要的查询条件都差不多吧,反正都调了同一个页面不是么

你也是这么想的对吧?

173851_g96i_1040430.jpg

呵呵。

我打开其中一个文件

呐就当我先打开的它吧

createsettlementmanage_search.jsp

...
function showAgentSearch(){
    var url = "<%=path%>/commission/agentSearch.jsp";
    var param = "dialogWidth:400px;dialogHeight:250px;help:no;unadorned:no;resizable:no;status:no";
    return window.showModalDialog(url,window,param);
}
...

...
<td class="pageCenter">代理人/经纪人:</td>
<td class="pageCenter">
    <input id="agentcode" name="agentcode" type="text" size="18">
    <input type="button" value=">" onclick="showAgentSearch()">
    <span style="color:#FF0000">*</span>
</td>
...

哎呦写得不错哦

呐既然id是agentcode那我在agentSearch.jsp里面填上agentcode不就好了么

果真是上一个人没写完啊啧啧啧,究竟是有多着急的事情啊连这个id都不肯加上

然后我淡定地把id给写了上去

parWin.document.getElementById("agentcode").value = val;

结果成功跑出来了。

对啊你以为呢?

175235_LArh_1040430.jpg

好了然后我打开了另一个文件

commissionsettlement.jsp

...
function showAgentSearch(){
    var url = "<%=path%>/commission/agentSearch.jsp";
    var param = "dialogWidth:400px;dialogHeight:250px;help:no;unadorned:no;resizable:no;status:no";
    return window.showModalDialog(url,window,param);
}
...

...
<td class="pageCenter">代理人/经纪人:</td>
<td class="pageCenter">
    <input id="agentname" name="agentname" type="text" size="18">
    <input type="button" value=">" onclick="showAgentSearch()">
    <span style="color:#FF0000">*</span>
</td>
...

哎呀一样的嘛,等我把东西交上去就...

等等

id为什么变成了agentname

175659_zZjO_1040430.jpg

卧槽。

怎么可以这样,人与人之间最基本的信任呢

接下来就是我们几个热烈讨论解决方案的时候了

我主张的是把agentSearch.jsp拷贝一份,改个参数,让一个文件调用这个agentSearch.jsp,另一个文件调用另一个agentSearch.jsp

简单粗暴。是的我就是这么不与世俗同流合污

093549_ZSY8_1040430.jpg

龙哥说还有一种是用div直接在当前页面显示就好,正好省的烦开一个新页面了

用w2ui或者easyui的话顺路界面还能更漂亮呢不是

听起来好有道理,不过代码要大改

094024_va5R_1040430.jpg

呵呵。

涛哥的意思是可以在showModalDialog()的时候传入一个参数parameter,当它是1的时候执行getElementById("agentcode"),当它是2的时候执行getElementById("agentname")

但是这个有一个重大问题就是,showModalDialog()只能传入三个参数sURL,vArguments,sFeatures

我说我们可以把参数放在vArguments里面啊多和谐啊水到渠成

龙哥说丫忘了我们还要回填了吧vArguments只能传父窗口的Object啊

095334_esPe_1040430.jpg

哦。

然后涛哥说我觉得我们可以在url里面放一个参数,就像这样

agentSearch.jsp?parameter=1

我和龙哥同时对其机智表示赞许并表示党国的未来还是要靠你们

100213_Z9Od_1040430.jpg

接下来就是实现了

那两个名字好长的文件只不过在url后面打个问号加个参数就不重新写了

是的我就是懒

100527_o7hN_1040430.png

现在只要改一下agentSearch.jsp就可以交差了

生活如此美好

<%String parameter=request.getParameter("parameter");%>
...
function backfill(){
    var val = document.getElementById("agentsearch").value;
    var parWin = window.dialogArguments;
    var parameter = <%=parameter%>;
    if (parameter == "1"){
        parWin.document.getElementById("agentcode").value = val;
    }else if (parameter == "2"){
        parWin.document.getElementById("agentname").value = val;
    }else{
        alert("呵(f**k)呵(you)。");
    }
    window.close();
}
...

先在上面用request.getParameter("parameter")获取到parameter的值

或者1或者2

当然了在不可抗力的作用下有可能产生一些奇怪的结果

比如说十一点断电了

然后 var parameter = <%=parameter%>; 是将参数赋值到javascript脚本中

接下来就是执行判断了

1的话这样

parWin.document.getElementById("agentcode").value = val;

2的话这样

parWin.document.getElementById("agentname").value = val;

其他的话乱入请不要介意

那这样的话任务就算完成了

在这里我只想对那个写这份代码的前一个同学说

You silly B!

hui duan!

shen me gui!

ni ma 【哔-】!

son of bick!

There's a fire starting in my heart~ Reaching a fever piss and it's bringing me out the dark~

102924_w9Gg_1040430.jpg

Done.


PS. 以上。是的我就是要把所有的变量名都叫 parameter 来砍死我啊呵呵呵。

140435_oiYw_1040430.jpg






转载于:https://my.oschina.net/u/1040430/blog/341773

2016-1-31 更新 1、使用时不再需要显示调用followCustomHandle方法,即可生效扩展属性。 2013-9-3 更新 1、$.showWindow 和 $.showModalDialog 在useiframe=true时,对窗体body增加遮罩控制。 2、easyui.tabs的add方法当useiframe=true时,增加遮罩控制。 3、toolbar增加url属性,可以通过请求后台数据构建。 4、增加mask(遮罩)扩展。 2013-8-26 更新 1、tree增加支持类标准数据格式加载,具体看demo或jquery.easyui.tree.extend.js文件开头说明。 2、修复datagrid在rowediting编辑风格时点击“确定”按钮无法提交问题。 3、datagrid和treegrid增加getEditingRows方法,用来获取所有正在编辑的行。 4、修复tabs.add方法,当useiframe=true时, iframe的高度改为100%。 5、修复当tabs使用iframe时,右键菜单刷新报错问题。 6、增加combotree对简单数据格式和类标准数据格式的加载,具体参考jquery.easyui.tree.extend.js文件开头说明。 7、修复datagrid.onConfirmEdit事件默认实现bug。 8、增加treegrid.onConfirmEdit事件。 2013-8-12 更新 1、修复combobox在级联操作时,递的swd参数值为null,而不是选中值。 2、datagrid的addEventListener 方法增加对事件onExpandRow和onCollapseRow的控制。 3、tree增加自定义属性 attributes,用于简单数据加载时,指定那些字段当作node的attributes属性使用。 4、combobox增加 getSelected 方法, 返回选中item的data值。 5、combogrid增加 getSelected 方法,返回选中item的data值。 6、datagrid增加 getAllExpandRowIndex 方法,用于在detailView视图下获取当前页已展开行的索引。 7、datagrid增加 getExpandRowIndex 方法,用于在detailView视图下获取当前页第一个展开行的索引。 8、datagrid增加 fixDetailRowWidth 方法,用于detailView视图下修改rowDetial中组件宽度。 9、getAllExpandRowIndex、getExpandRowIndex、fixDetailRowWidth 这三个方法联合使用可解决detailView视图下列拖拽时显示错位问题。 10、修复datagrid 的rowEditing编辑风格在没有数据的datagrid中增加数据后,再编辑时无法显示的问题。 11、datagrid增加自定义事件 onConfirmEdit , 用于rowEditing编辑风格点击“确定”按钮时触发。当事件返回false时终止endEdit方法调用。 2013-7-31 更新 1、$.showWindow、$.showModalDialog 这两个方法增加返回值,返回值指向当前弹出窗的引用。 2、移除根据$.browser.msie判断浏览器版本。 2013-7-18 更新 1、menu、datagrid、combo、combobox、panel、tabs、tree、treegrid 增加 addEventListener 方法。 2、修复menu、datagrid、combo、combobox、panel、tabs、tree、treegrid 因事件注册造成多次重复渲染的问题(包括多次请求后台数据)。 3、移除datagrid 的rowContextMenu菜单项默认事件替换功能。 4、删除datagrid rowContextMenu默认菜单中的增加、编辑、导出菜单项。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值