案例

今天在用DWZ框架做添加功能时,发现在对话框保存成功后,后端返回正确的json格式,但对话框不能自动关闭窗口,而且保存后自动跳回主页,没有停留在当前用户列表页面,具体错误过程重现如下:

1.打开用户列表

2.点击添加按钮

3.在打开的添加对话窗口填入信息后,点击保存

4.添加成功后,对话框并没有自动关闭,而且用户列表也不见了

5.重新打开用户礼拜哦,可以看到刚才的数据已经成功保存

6.后端返回的json格式也没有问题

解决方案


为什么会出现以上原因呢?原来是因为我在添加对话窗口页面里面配置的回调函数方法配置错了,填了navTabAjaxDone该方法,但是根据dwz框架手册说明,对于dialog,应该 填入dialogAjaxDone,navTabAjaxDone该方法只针对面板窗口,错误示范如下:



对于dialog方式打开的对话框,正确的回调函数应该如下配置:


DWZ框架说明


对于navTab和dialog两种打开方式,后端返回的json数据结构是一样的,但是回调函数有所不同,如果没有填入指定的navTabId,则默认跳回当前的navTab页面,但是数据结构和navTab方式一致,其他可以填空字符创,但是记得填入setv("callbackType", "closeCurrent") ,否则当前对话框保存成功会也不会自动关闭,以下是后端json数据样例以及官方源码:




  1. /**
  2. * navTabAjaxDone是DWZ框架中预定义的表单提交回调函数.
  3. * 服务器转回navTabId可以把那个navTab标记为reloadFlag=1, 下次切换到那个navTab时会重新载入内容.
  4. * callbackType如果是closeCurrent就会关闭当前tab
  5. * 只有callbackType="forward"时需要forwardUrl值
  6. * navTabAjaxDone这个回调函数基本可以通用了,如果还有特殊需要也可以自定义回调函数.
  7. * 如果表单提交只提示操作是否成功, 就可以不指定回调函数. 框架会默认调用DWZ.ajaxDone()
  8. * <form action="/user.do?method=save" onsubmit="return validateCallback(this, navTabAjaxDone)">
  9. *
  10. * form提交后返回json数据结构statusCode=DWZ.statusCode.ok表示操作成功, 做页面跳转等操作. statusCode=DWZ.statusCode.error表示操作失败, 提示错误原因.
  11. * statusCode=DWZ.statusCode.timeout表示session超时,下次点击时跳转到DWZ.loginUrl
  12. * {"statusCode":"200", "message":"操作成功", "navTabId":"navNewsLi", "forwardUrl":"", "callbackType":"closeCurrent", "rel"."xxxId"}
  13. * {"statusCode":"300", "message":"操作失败"}
  14. * {"statusCode":"301", "message":"会话超时"}
  15. *
  16. */
  17. function navTabAjaxDone(json){
  18. DWZ.ajaxDone(json);
  19. if (json[DWZ.keys.statusCode] == DWZ.statusCode.ok){
  20. if (json.navTabId){ //把指定navTab页面标记为需要“重新载入”。注意navTabId不能是当前navTab页面的
  21. navTab.reloadFlag(json.navTabId);
  22. } else { //重新载入当前navTab页面
  23. var $pagerForm = $("#pagerForm", navTab.getCurrentPanel());
  24. var args = $pagerForm.size()>0 ? $pagerForm.serializeArray() : {}
  25. navTabPageBreak(args, json.rel);
  26. }
  27.  
  28. if ("closeCurrent" == json.callbackType) {
  29. setTimeout(function(){navTab.closeCurrentTab(json.navTabId);}, 100);
  30. } else if ("forward" == json.callbackType) {
  31. navTab.reload(json.forwardUrl);
  32. } else if ("forwardConfirm" == json.callbackType) {
  33. alertMsg.confirm(json.confirmMsg || DWZ.msg("forwardConfirmMsg"), {
  34. okCall: function(){
  35. navTab.reload(json.forwardUrl);
  36. },
  37. cancelCall: function(){
  38. navTab.closeCurrentTab(json.navTabId);
  39. }
  40. });
  41. } else {
  42. navTab.getCurrentPanel().find(":input[initValue]").each(function(){
  43. var initVal = $(this).attr("initValue");
  44. $(this).val(initVal);
  45. });
  46. }
  47. }
  48. }
  49.  
  50. /**
  51. * dialog上的表单提交回调函数
  52. * 当前navTab页面有pagerForm就重新加载
  53. * 服务器转回navTabId,可以重新载入指定的navTab. statusCode=DWZ.statusCode.ok表示操作成功, 自动关闭当前dialog
  54. *
  55. * form提交后返回json数据结构,json格式和navTabAjaxDone一致
  56. */
  57. function dialogAjaxDone(json){
  58. DWZ.ajaxDone(json);
  59. if (json[DWZ.keys.statusCode] == DWZ.statusCode.ok){
  60. if (json.navTabId){
  61. navTab.reload(json.forwardUrl, {navTabId: json.navTabId});
  62. } else {
  63. var $pagerForm = $("#pagerForm", navTab.getCurrentPanel());
  64. var args = $pagerForm.size()>0 ? $pagerForm.serializeArray() : {}
  65. navTabPageBreak(args, json.rel);
  66. }
  67. if ("closeCurrent" == json.callbackType) {
  68. $.pdialog.closeCurrent();
  69. }
  70. }
  71. }


DWZ框架-- Dialog点击保存后不能自动关闭的更多相关文章

  1. 弹框勾选datatable中的数据,点击保存后添加到另一个表中,同一个页面

    需求描述:做编辑的时候,点击添加按钮,弹出数据表table2,勾选弹出框中的数据,点击保存后能够添加到table1中,并且已经被添加到table1中的数据,在弹出框中显示已选,checkbox隐藏:t ...

  2. DWZ框架一些技巧

    DWZ框架from表单提交后关闭对话框 注意大小写 <input type="hidden" name="callbackType" value=&quo ...

  3. dwz框架---(2)表单回调函数

    dwz中的表单回调函数大概有下面几种: /** * 普通ajax表单提交 * @param {Object} form * @param {Object} callback * @param {Str ...

  4. window.history 和 DWZ 框架

    DWZ框架的ajax请求返回的一般都是一个HTML片段,整个页面是由一个个HTML片段组成的,可以由TAB切换其内容,但是只有一个body和HEAD,一般head 和 菜单栏是不会动的. 今天遇到一个 ...

  5. DWZ框架Ajax无刷新表单提交处理流程

    DWZ框架Ajax无刷新表单提交处理流程是: 1.       ajax表单提交给服务器 2.       服务器返回一个固定格式json结构 3.       js会调函数根据这个json数据做相应 ...

  6. DWZ (JUI) 教程 DWZ中dialog层的刷新

    在DWZ开发过程中经常会遇到的一种情况就是:在navTab页面中通过a标签打开一个dialog,在dialog层进行操作后,需要对该dialog层进行必要的刷新操作. 1.首先讲一下思路: 在非dia ...

  7. DWZ框架学习一

    测试DWZ框架弹出框设置成模态 刚刚上手DWZ框架,感觉灰常好用,对于我这种特别懒的人来说,真的是拖拽编程 看了下官方的视频讲解,自己试着做了一个小测试,里面的组件什么的都不用写,直接拿来用 这里附上 ...

  8. 点击按钮后到底发生了什么,Touch,LongClick或者Click?

    按钮点击事件详解 最近一个项目需要给应用初始界面上的动态按钮添加在不同状态的变换效果,如点击(俗一点也可称为按压)后实现背景图的更换或者图标的缩放等效果.由于按钮点击的时间有长有短,所以采用OnTou ...

  9. 解决TableView / ScrollView上的Menu问题(1滑出View区域还可点击2导致点击menu后View不能滑动)

    解决TableView / ScrollView上的Menu问题 1划出区域还可点击 重写CCMenu的触摸事件函数 TouchBegin/TouchMove/TouchCancle/TouchEnd ...

随机推荐

  1. kotlin + springboot启用elasticsearch搜索

    参考自: http://how2j.cn/k/search-engine/search-engine-springboot/1791.html?p=78908 工具版本: elasticsearch ...

  2. $bzoj2560$ 串珠子 容斥+$dp$

    正解:容斥+$dp$ 解题报告: 传送门$QwQ$ $umm$虽然题目蛮简练的了但还是有点难理解,,,我再抽象一点儿,就说有$n$个点,点$i$和点$j$之间有$a_{i,j}$条无向边可以连,问有多 ...

  3. 机器学习——EM算法与GMM算法

    目录 最大似然估计 K-means算法 EM算法 GMM算法(实际是高斯混合聚类) 中心思想:①极大似然估计 ②θ=f(θold) 此算法非常老,几乎不会问到,但思想很重要. EM的原理推导还是蛮复杂 ...

  4. Java 迭代器须知 | “for each”与迭代器的关系

    Iterator接口包含4个方法: 通过反复调用next方法就可以逐个访问集合中的每个元素.需要注意,如果到达了集合的末尾,再次调用next方法将会抛出一个NoSuchElementException ...

  5. 「学习笔记」 FHQ Treap

    FHQ Treap FHQ Treap (%%%发明者范浩强年年NOI金牌)是一种神奇的数据结构,也叫非旋Treap,它不像Treap zig zag搞不清楚(所以叫非旋嘛),也不像Splay完全看不 ...

  6. C++简单项目--推箱子

    在处理移动的时候有太多种情况了: 1.有空位 2.在推箱子,推到了空地 3.推箱子推到了目标, 4.推目标位的箱子推到另一个目标 5.推目标位的箱子推到空地 首先记录目标位置,在每次推动之后会再绘画中 ...

  7. Python 生成器和协程使用示例

    一.生成器的创建及使用 生成器比迭代器更节省内存空间,使用生成器,可以生成一个值的序列用于迭代,并且这个值的序列不是一次生成的,而是使用一个,再生成一个,的确可以使程序节省大量的内存损耗 创建生成器, ...

  8. mqtt实现跨平台跨应用通讯

    介绍 最近物联网应用一直很火,也打算做一些这方面的尝试,就边学边做在家花了2天时间做了一个简单demo,功能很简单,使用emq x 作为mqtt broker,用python写了一个定时抓取主机CPU ...

  9. Go Web 编程之 响应

    概述 上一篇文章中,我们介绍了请求的结构与处理.本文将详细介绍如何响应客户端的请求.其实在前面几篇文章中,我们已经使用过响应的功能--通过http.ResponseWriter发送字符串给客户端. 但 ...

  10. vue resource 携带cookie请求 vue cookie 跨域

    vue resource 携带cookie请求 vue cookie 跨域 1.依赖VueResource 确保已安装vue-resource到项目中,找到当前项目,命令行输入: npm instal ...