博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
DWZ实践——Dialog到NavTab的跳转
阅读量:6654 次
发布时间:2019-06-25

本文共 727 字,大约阅读时间需要 2 分钟。

hot3.png

1.场景

在左侧菜单栏中点击某一链接,弹出对话框,对话框中需要用户选择某一信息(select),点击下一步,关闭对话框,然后跳转到一个navtab。

2.版本

1.4.3

3.解决方案

1)对话框如何跳转到navtab?

对话框跳转到navTab,一开始我一直纠结在<button>如何跳转到navTab,后来仔细一想,DWZ只有对超链接(<a href......>)进行扩展,所以我们需要用超链接来实现,当然DWZ已经为超链接定义了按钮样式:

下一步

2)跳转时如何取得select中选择的值然后再跳转?

跳转时要携带select中已经选择的值,我最先想到的是通过js来实现,比如:

测试后发现,这样会打乱DWZ的默认行为,我们不能添加onclick事件,跳转路径必须在href中。于是我选用DWZ原生的方式操作,首先添加一个隐藏域,当select发生变化时,给隐藏域设值,隐藏域需要包含rel属性:

然后我们在超链接中直接取值即可:

 

3)如何在跳转后关闭dialog?

跳转后关闭此dialog,如果是传统的使用dialog很好办,只需要在返回的json数据中设置下关闭属性即可。但是现在我需要做跳转,没有json数据。这个时候我首先想到超链接的callback属性,但是细细读文档发现callback是ajax的回调函数,这里不是异步的。我只好在新的NavTab中添加关闭dialog的js:

$.pdialog.close("select_xi");

关闭dialog的方法在DWZ的文档里有详细说明,select_xi是dialog的id。

转载于:https://my.oschina.net/xishuixixia/blog/117977

你可能感兴趣的文章
backBone.js初识
查看>>
Web API 安全问题
查看>>
ubuntu 14.04 安装preforce
查看>>
Ognl底层使用
查看>>
sflow
查看>>
Codeforces 85B. Embassy Queue【段树、馋】
查看>>
产品管理流程
查看>>
iOS_数据库3_sqlite3基本操作
查看>>
Linux下php安装Redis扩展
查看>>
ANDROID L——RecyclerView,CardView进口和使用(Demo)
查看>>
jmeter经验----java 读取文件中文乱码问题
查看>>
Jmeter调试工具---HTTP Mirror Server
查看>>
js bool true false 比较
查看>>
Stream(流)的基本操作
查看>>
使用 GIT 获得Linux Kernel的代码并查看,追踪历史记录
查看>>
反向传播神经网络极简入门
查看>>
Objective-C中的@dynamic
查看>>
STORM在线业务实践-集群空闲CPU飙高问题排查(转)
查看>>
Section Formula
查看>>
预处理指令
查看>>