关于jConfirm回传的解决方案

简介:

jQuery Alert Dialogs (Alert, Confirm, & Prompt Replacements)(翻译)发布后,受到大家的很多鼓励,在这里先感谢大家。

在昨天lastwinter留言关于jConfirm的问题,如下

      我趁今天有空就考虑了下。我觉得lastwinter问这个问题应该是关于ASP.NET的回传问题,这主要是jConfirm这个为CallBack回调,

他是异步的,并非同步。所以我尝试了下阻止事件的冒泡,并当选择为true是自动回传。用LinkButton测试(Button不同于这个解决的方案在后面解释)

现贴出LinkButton的CODE DEMO:

 

 
  1. 关于jConfirm回传DEMO  
  2. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
  3.  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
  5. <html xmlns="http://www.w3.org/1999/xhtml">   
  6. <head runat="server">   
  7.     <title></title> 
  8.  
  9.     <script src="Script/jquery-1.3.2.min.js" type="text/javascript"></script>   
  10.     <script src="Script/jquery.alerts-1.1/jquery.alerts.js" type="text/javascript"></script> 
  11.  
  12.     <link href="Script/jquery.alerts-1.1/jquery.alerts.css" rel="stylesheet" type="text/css" />   
  13. </head>   
  14. <body>   
  15.     <form id="form1" runat="server">   
  16.     <asp:LinkButton ID="LinkButton1" runat="server" >LinkButton</asp:LinkButton>   
  17.     <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>   
  18.       
  19.     <div>   
  20.     </div>   
  21.     </form> 
  22.  
  23.     <script type="text/javascript">   
  24.         $(document).ready(function() {   
  25.             $("#<%=LinkButton1.ClientID %>").click(function(event) {  
  26.  
  27.             jConfirm("test", "test jconfirm", function(r) {   
  28.             if (r) {   
  29.                     <%= Page.ClientScript.GetPostBackClientHyperlink(LinkButton1,"") %>   
  30.                     }   
  31.                 });   
  32.                 event.stopPropagation();   
  33.                 event.preventDefault();  
  34.  
  35.             });  
  36.  
  37.         });   
  38.     </script> 
  39.  
  40. </body>   
  41. </html> 

 

 
  1. LinkButton1 Button Click CODE  
  2. protected void Button1_Click(object sender, EventArgs e)   
  3.    {   
  4.        this.Label1.Text = DateTime.Now.ToString();   
  5.    }  

要为先阻止事件的冒泡event.stopPropagation();event.preventDefault(); 在jConfirm的callback回调函数中判断是否需要回传,

<%= Page.ClientScript.GetPostBackClientHyperlink(LinkButton1,"") %>;;

点击LinkButton1是效果为:

          点击Cancel时候就不会回传,当ok时候就会发生回传更新时间:

对于我们的LinkButton的实现是在输出的客户端Html代码有脚本自动回传,而Button这是HTML元素submit,提交,

         所以在这两个的区别下,LinkButton就多了几处javascript 代码:

 
  1. <script type="text/javascript">  
  2.  
  3. //<![CDATA[  
  4.  
  5. var theForm = document.forms['form1'];  
  6.  
  7. if (!theForm) {  
  8.  
  9. theForm = document.form1;  
  10.  
  11. }  
  12.  
  13. function __doPostBack(eventTarget, eventArgument) {  
  14.  
  15. if (!theForm.onsubmit || (theForm.onsubmit() != false)) {  
  16.  
  17. theForm.__EVENTTARGET.value = eventTarget;  
  18.  
  19. theForm.__EVENTARGUMENT.value = eventArgument;  
  20.  
  21. theForm.submit();  
  22.  
  23. }  
  24.  
  25. }  
  26.  
  27. //]]>  
  28.  
  29. </script>  
  30.  
  31. 和 input Hidden  
  32.  
  33. <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />  
  34.  
  35. <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />  
  36.  

上面所说的意思就是如果要用Button实现同样的示例,我们必须保证我的输出客户端的代码有这些回传脚本注册,还有就是回传为

<%=Page.ClientScript.GetPostBackEventReference(Button1,"") %>。所以我觉得用LinkButton更适合。






 本文转自 破狼 51CTO博客,原文链接:http://blog.51cto.com/whitewolfblog/834341,如需转载请自行联系原作者


相关文章
|
9月前
|
存储 JSON 前端开发
前端接收后端数据时,遇到精度丢失的问题
前端接收后端数据时,遇到精度丢失的问题
552 0
|
9月前
|
JSON 前端开发 API
在Scalatra中响应JSON格式的诸多问题
如今的前端JSON已无处不在,如何在Scalatra中使用json响应数据给前端呢,尽管官方只是介绍了一下json4s,其实仍然需要注意其中的一些细节
58 0
|
10月前
|
数据采集 监控 前端开发
网络抖动对重复提交的影响与解决方案
网络抖动对重复提交的影响与解决方案
245 0
|
网络协议 测试技术 Go
海量用户通讯系统-服务器接收消息1
海量用户通讯系统-服务器接收消息1
72 0
海量用户通讯系统-服务器接收消息1
|
JSON 网络协议 测试技术
海量用户通讯系统-服务器接收消息2|学习笔记
快速学习海量用户通讯系统-服务器接收消息2
86 0
海量用户通讯系统-服务器接收消息2|学习笔记
|
Web App开发 存储 编解码
浅析WebRtc中视频数据的接收和渲染流程
本文基于PineAppRtc开源项目github.com/thfhongfeng… 因为一个需求,我们需要将WebRtc发送过来的视频流中转出去,所以就研究一下WebRtc是如何接收视频数据并进行处理渲染的,于是有了这篇文章。
533 0
|
人工智能 安全 JavaScript
前后端通讯:非敏感信息Cookie的"强化"之路
我们公司鉴权走的是JWT, 但是有些数据走Cookie更方便通讯, 纵观今天,网上一大把说Cookie不好的文章. 但是我们还是要用,那怎么安全一丢丢呢?
121 0
|
前端开发 数据挖掘 5G
云无线接入网络的前向回传感知设计 | 带你读《5G系统关键技术详解》之十一
云无线接入网络(C-RAN,Cloud Radio Access Network)是第五代(5G,Fifth Generation)无线蜂窝网络的新兴范例,传统的物理层基站(BS,Base Station)传输和接 收基础设施使用云计算技术进行虚拟化。
云无线接入网络的前向回传感知设计  | 带你读《5G系统关键技术详解》之十一