2013-05-13 67 views
0

我有一个ASP.NET页面上有一些更新面板。页面加载后,我想让updatepanels触发更新面板。如何获取ASP.NET page_load事件来触发AJAX UpdatePanel更新

我正在使用this回答这说,把这个Javascript的页面。

$(document).ready(function() { 
    window.__doPostBack('<%= hiddenAsyncTrigger.ClientID %>', 'OnClick'); 
}); 

然而,这会导致垃圾邮件的单击事件becasue负载事件被触发antoher负载...?

更新面板的所有功能很好,问题是触发更新发生一次在页面加载

回答

0

端向上的J解决这个avascript触发UpdatePanel的

JS

var timer; 
var polling_interval = 30000; 

$(document).ready(function() { 
    TriggerUpdatePanelUpdate();// update as soon as DOM is ready 
    StartPolling(); 
}); 

function StartPolling() { 
    PollLoop(); 
} 

function StopPolling() { 
    clearTimeout(timer); 
} 

function PollLoop() { 
    timer = setTimeout(
     function() { 
      TriggerUpdatePanelUpdate(); 
      PollLoop(); 
     }, 
     polling_interval 
    ); 
} 

function TriggerUpdatePanelUpdate() { 
    document.getElementById('hiddenAsyncTrigger').click(); 
} 

HTML

<asp:Button ID="hiddenAsyncTrigger" runat="server" OnClick="DoWork" Text="AsyncUpdate" style="display: none;"/> 
1

使用客户端的控制,而不是服务器端后:

<%@ Page Language="C#" %> 
<script runat="server"> 
    protected string CurrentTime() 
    { 
    return DateTime.Now.ToString(); 
    } 
</script> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 
    <title>Untitled Page</title> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script language="JavaScript"> 
     $(document).ready(function() { 
     $("#Updater").click() 
     }); 
    </script> 
    </head> 

    <body> 
    <form id="MyForm" runat="server"> 
     <div> 
     Outside the panel: <%=CurrentTime() %> 
     </div> 
     <br /> 
     <br /> 
     <asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" runat="server" /> 
     <asp:UpdatePanel ID="panel" runat="server" UpdateMode="conditional"> 
     <ContentTemplate> 
      <div> 
      Inside the panel: <%=CurrentTime() %> 
      </div> 
      <input type="submit" id="Updater" style="display: none" /> 
     </ContentTemplate> 
     </asp:UpdatePanel> 
    </form> 
    </body> 
</html> 

另一种解决方案 - 不隐藏的触发,利用__doPostBack

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplicationTest.WebForm1" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
    <title>Untitled Page</title> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script language="JavaScript"> 
     $(document).ready(function() { 
      __doPostBack('panel', ''); 
     }); 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <div> 
      Outside the panel: <%=CurrentTime() %> 
     </div> 
     <br /> 
     <br /> 
     <asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" runat="server" /> 
     <asp:UpdatePanel ID="panel" runat="server" UpdateMode="conditional"> 
      <ContentTemplate> 
       <div> 
        Inside the panel: <%=CurrentTime() %> 
       </div> 
       <input type="submit" id="Updater" style="display: none" /> 
      </ContentTemplate> 
     </asp:UpdatePanel> 
    </form> 
</body> 
</html> 

using System.Web.UI; 
using System.Web.UI.WebControls; 

namespace WebApplicationTest 
{ 
    public partial class WebForm1 : System.Web.UI.Page 
    { 
     protected string CurrentTime() 
     { 
      System.Diagnostics.Debug.WriteLine("CurrentTime was called"); 
      return DateTime.Now.ToString(); 
     } 

     protected void Page_Load(object sender, EventArgs e) 
     { 
      System.Diagnostics.Debug.WriteLine("PageLoad was called"); 
     } 
    } 
} 
+0

第一个解决方案不会是异步,因为你还是老样子lhave等待CURRENTTIME()来运行一个隐藏的按钮? – SkeetJon 2013-05-13 13:30:36

+0

与第二种解决方案相同,因为在Page_Load上调用了<%= CurrentTime()%>方法。我想我错过了一些东西 – SkeetJon 2013-05-13 13:31:44

+0

@SkeetJon - 更新面板通过JavaScript执行异步回传。前两个对<%= CurrentTime()%>的调用不是异步的,但仅适用于此演示,并非真正需要。随意删除它们。 – 2013-05-13 15:42:25