ale*_*nso 6 javascript c# asp.net thickbox jgrowl
点击链接时我正在调用thickbox:
<a href="createContact.aspx?placeValuesBeforeTB_=savedValues&TB_iframe=true&height=400&width=550&modal=true"
title="Add a new Contact" class="thickbox">Add a new Contact</a>
Run Code Online (Sandbox Code Playgroud)
并且,当单击服务器按钮时,我调用此javascript函数来显示jGrowl通知:
ScriptManager.RegisterClientScriptBlock(this, typeof(Page), Guid.NewGuid().ToString(), "$(function(){$.jGrowl('No Contact found: " + searchContactText.Text + "');});", true);
Run Code Online (Sandbox Code Playgroud)
两者都按预期工作,除非首先显示jGrowl而不是厚盒.这将导致厚箱无法工作,页面将显示为普通网页(就像厚箱已经消失一样).
有谁知道发生了什么?
更新:这是没有母版页的测试页面:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="RoutingPortal.Presentation.WebForm2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="../Scripts/jquery-1.6.2.js" type="text/javascript"></script>
<script src="../Scripts/jquery-ui-1.8.16.custom.min.js" type="text/javascript"></script>
<script src="../Scripts/thickbox.js" type="text/javascript"></script>
<script src="../Scripts/jquery.jgrowl.js" type="text/javascript"></script>
<link href="../Scripts/css/jquery.jgrowl.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="~/CSS/thickbox.css" type="text/css" media="screen" />
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div>
<a href="createContact.aspx?placeValuesBeforeTB_=savedValues&TB_iframe=true&height=400&width=550&modal=true"
title="Add a new Contact" class="thickbox">Add a new Contact</a>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这是代码隐藏:
namespace RoutingPortal.Presentation
{
public partial class WebForm2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
ScriptManager.RegisterClientScriptBlock(this.Page, typeof(Page), Guid.NewGuid().ToString(),
"$(function(){$.jGrowl('My Message');});", true);
}
}
}
Run Code Online (Sandbox Code Playgroud)
我刚刚在没有UpdatePanel的情况下对它进行了测试,它运行得很好.因此,它肯定是UpdatePanel的一个问题,或者它与从代码隐藏调用的jGrowl交互的方式.
我非常感谢你们的帮助.
更新:我甚至创建了一个可以轻松识别此问题的演示项目.不介意把它发送给任何愿意帮助我的人.先谢谢你们!
更新:我也尝试过@Rick提供的解决方案,改变了代码隐藏执行jGrowl脚本的方式:
ScriptManager.RegisterStartupScript(this.Page, typeof(Page), Guid.NewGuid().ToString(),
"$.jGrowl('My Message');", true);
Run Code Online (Sandbox Code Playgroud)
但是,问题仍然存在,因为结果完全相同.还有其他想法吗?我非常感谢你的帮助.
更新:我也在IE8和Chrome中尝试了这个,面临同样的问题.所以,这与浏览器无关.以防万一.
我相信您的问题与 jGrowl 无关,而与您使用 UpdatePanel 有关。
当您使用 UpdatePanel 时,它会刷新其中包含的 DOM 中的所有元素。这意味着<a>在页面中创建且其单击事件设置为使用厚盒的原始标记不再存在。UpdatePanel 刷新后,您现在有了一个新<a>标记,该标记具有厚盒类,但尚未“初始化”(因为厚盒在页面加载期间设置单击处理程序,这在部分回发期间不会像正常情况那样发生)。因此,当您单击该链接时,它的作用就像普通链接一样。
有多种方法可以解决此问题,具体取决于您的情况。
选项 1:根据上面粘贴的代码,在回发处理期间,看起来并没有与链接相关的任何实际更改。因此,也许您可以将其移到<div><a ...></a> </div>UpdatePanel 之外,而只将按钮保留在内部。这将使您的链接保留为页面的一部分,并且仍然会附加其厚盒处理程序。
选项 2:如果由于某种原因您无法使用选项 1,那么您可以设置一些 javascript 在加载 UpdatePanel 期间运行,以重新附加链接的点击处理程序。在调用 jGrowl 的函数中,尝试添加tb_init('a.thickbox');到您的代码中。
选项3:您可以修改thickbox.js 文件以使用jQuery 的实时处理程序而不是普通的单击处理程序。在tb_init函数中,您可以将其更改为$(domChunk).live('click', function(){..}). 我认为这会起作用,尽管更新面板过程可能仍然会阻止它。
希望这可以帮助。
| 归档时间: |
|
| 查看次数: |
1007 次 |
| 最近记录: |