DWZ使用中遇到的坑
DWZ官方文档中关于文件上传表单的提交:
因为Ajax不支持enctype="multipart/form-data" 所以用隐藏iframe来处理无刷新表单提交.
<form method="post" action="url" class="pageForm required-validate" enctype="multipart/form-data"
onsubmit="return iframeCallback(this, [navTabAjaxDone/dialogAjaxDone]);">
服务器端响应
DWZ-v1.2版本开始服务器返回和validateCallback格式保持一致:
{
"statusCode":"200",
"message":"操作成功",
"navTabId":"",
"rel":"",
"callbackType":"closeCurrent",
"forwardUrl":""
}
第一个坑是,因为要上传文件,所以表单必须使用隐藏iframe的方式来处理,可是服务端返回的数据必须是JSON格式的,而不能使html,所以处理后的数据就不能展示了,只能说是提示操作状态。
第二个坑是,因为上传文件后在服务端分析数据后需要去展示,所以想着以弹窗的方式去展示,却发现了另外一个坑,事情是这样的:
dialog链接扩展:
<a href=”xxx” target=“dialog” [rel=“dialogId”]>
A所指向页面将会在dialog 弹出层中打开,rel标识此弹出层的ID,rel为可选项。
Html标签扩展方式示例:
<a href="w_dialog.html" target="dialog" rel="page2">弹出窗口</a>
或
<a href="demo_page1.html" target="dialog" [max=true, mask=true, maxable=true, minable=true, resizable=true,drawable=true]
rel="dlg_page1" title="[自定义标题]" width="800" height="480">打开窗口一</a>
关闭窗口:
在弹出窗口页面内放置<button class="close" value="关闭"></button>即可。
JS调用方法示例:
$.pdialog.open(url, dlgId, title);
或
$.pdialog.open(url, dlgId, title, options);
也就是说要想在页面打开一个弹窗,就必须要加载一个页面,指定一个地址,不然的话就给你报错。。。为啥不能展示本地数据呢。。。好蛋疼的设计。
为了展示数据,于是乎在分析完文件数据后将结果存到了memcache中,然后返回一个Key放到了返回json中,好在可以自定义回调函数,将key放到一个连接中通过jQ模拟提交,通过另一个页面展示出来。擦,好纠结的业务逻辑。。。泪奔了。。。
自定义的回调函数:
// 弹出被覆盖的数据
function customAjaxDone(json){
if (json.statusCode == DWZ.statusCode.ok){
if (json.content.toString() == "xxx"){
DWZ.ajaxDone(json);
} else {
$("#xxx").attr("href", "{{ wrap_url('xxx/show_replace_data?hash=')}}" + json.content);
$("#xxx").click();
}
}
else{
DWZ.ajaxDone(json);
}
}
表单事件:
onsubmit="return iframeCallback(this, customAjaxDone);"
DWZ使用中遇到的坑的更多相关文章
- sql server全文索引使用中的小坑
一.业务场景 我们在实际生产环境中遇到了这样一种需求,即需要检索一个父子关系的子树数据 估计大家也遇到过类似的场景,最典型的就是省市数据,其中path字段是按层级关系生成的行政区路径: 如果我们已知某 ...
- Volly框架的使用基础版及使用中的一些坑 Ace 网络篇(三)
直接把注释粘过来: * Volley使用讲解: * 要实现网络数据请求主要要记住下面三步骤: * 1.创建RequestQueue对象 * 2.创建XXRequest对象(XX代表String,JSO ...
- c#参数传递使用中的一个坑,值传递与引用传递
c#参数传递使用中发现的一个问题 写了3个重载方法,把 对象.int .(int直接封入object) 传入SWAP方法进行数据操作结果对象内的数据发生了改变,其他2个没有:
- lua 使用中遇到的坑总结
前言 竹子是 java 程序员一枚,最近在做一个登录的改造,用 lua 实现,现在基本算是告一段落,然后在此分享下在过程中遇到的坑吧. 一定要注意使用 lua 的版本,版本不同,可能有的函数就没有了, ...
- sql server全文索引使用中的小坑 (转载)
一.业务场景 我们在实际生产环境中遇到了这样一种需求,即需要检索一个父子关系的子树数据 估计大家也遇到过类似的场景,最典型的就是省市数据,其中path字段是按层级关系生成的行政区路径: 如果我们已知某 ...
- spring cloud zuul在使用中遇到的坑 : 转发时自动去掉prefix
在使用zuul的时候遇到的坑总结一下: 逐渐增加更新以后遇到的 1.在路由的时候莫名其妙的把serviceId给去掉,导致404.比如请求:/serviceId/search/book,zuul会把s ...
- Maven学习(六)maven使用中遇到的坑
坑1:使用eclipse构建web项目时,pom.xml中 <packaging>war</packaging> 报错 eclipse给出的报错信息提示是:web.xml is ...
- kubernetes使用中遇到的坑
随着kubernetes的发展现在使用的范围越来越广,在使用过程中碰到问题是避免不了的,有些时候一些坑能提前避免是最好的,下面我做一个小记录,把我们生产环境中遇到的坑总结下,方便后面查询同时也方便各位 ...
- 解决 mklink 使用中的各种坑(硬链接,软链接/符号链接,目录链接)
通过 mklink 命令可以创建文件或文件夹的链接,而这种链接跟快捷方式是不一样的.然而我们还可能会遇到其使用过程中的一些坑,本文将整理这些坑并提供解决方法. 0x00 背景介绍:mklink m ...
随机推荐
- HDU.5215.Cycle(判环)
题目链接 \(Description\) 给定\(n\)个点\(m\)条边的无向图,问是否存在一个长度为奇数/偶数的简单环. \(n\leq 10^5,m\leq 3\times 10^5\). \( ...
- 洛谷.U19464.山村游行wander(LCT 伪期望)
题目链接 题意: 森林,动态建边.删边,询问从S开始走到T的期望时间.走位: 每次人会随机地选一条未走过的边走,走到无路可走,再退回.这样直到终点T.走一条边.从一条边退回都花费时间1. 题目特点是走 ...
- 解决boostrap中,iframe渲染下,苹果手机横向无法显示剩余内容问题
描述: 问题解决了,采用的手势拖动显示剩余内容,并不是有了横向滚动条 在head标签中加入 <head> <meta charset="utf-8"> &l ...
- kaggle PredictingRedHatBusinessValue 简单的xgboost的交叉验证
PredictingRedHatBusinessValue 这个超级简单的比赛 随手在一个kernels上面随便改了改,交叉验证的xgboost: 感觉还是稍微有一点借鉴意义的(x 注释的部分是One ...
- 来自极客头条的 15个常用的javaScript正则表达式
摘要收集整理了15个常用的javaScript正则表达式,其中包括用户名.密码强度.整数.数字.电子邮件地址(Email).手机号码.身份证号.URL地址. IPv4地址. 十六进制颜色. 日期. Q ...
- Oracle ORA-12541:TNS:无监听程序
背景:自己机子做oracle服务器,其他机子可以ping得通我的机子,但是jdbc就是连不上,后来用plsql连出现无监听程序.... 我昨天重新安装Oracle后,用PL/SQL Developer ...
- 碰到在Windows中访问局域网文件夹, 提示无法访问时的解决办法
运行:gpedit.msc 找到下图的位置, 启用即可
- 怎样使用ZOL一键安装器下载中关村在线的源安装包
怎样使用ZOL一键安装器下载中关村在线的源安装包 马根峰 (广东联合电子服务股份有限公司, 广州 510300) 摘要 中关村在线近期開始推出ZOL一键安装器,用户直 ...
- python测试开发django-47.xadmin上传图片和文件
前言 xadmin上传图片和上传文件功能 依赖环境 如果没安装Pillow的话,会有报错:practise.Upload.upload_image: (fields.E210) Cannot use ...
- java实现八种排序算法并测试速度
速度测试: (1) 随机数范围:0-100希尔排序: => Time is 38600基数排序: => Time is 53300快速排序: => Time is 46500堆 排 ...