如何在UpdateProgress放置在ASP.NET c＃之后触发JavaScript事件？

我有一个WebForm，我有一个评估它是否应该显示一个div ... 这里的功能的JavaScript函数...如何在UpdateProgress放置在ASP.NET c＃之后触发JavaScript事件？

function viewCalendars() 
      { 
       if (document.getElementById('ddlDates').value == '5') 
       { 
        document.getElementById('divSpecificDates').style.display = 'inline'; 
       } 

       else 
       { 
        document.getElementById('divSpecificDates').style.display = 'none'; 
       } 

       return; 
      }

我也添加到了我的形式

<body onload="viewCalendars();"> 
//Everything 
</body>

所以，即使有回发，如果下拉列表中选择了特定的值，它也会显示div。

但是，我最近添加了一个updatepanel和一个updateprogress ...现在我认为这将不再工作，因为回发不会发生。

这是我现在有...

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Consumptions.aspx.cs" Inherits="Station.Consumptions" %> 
<%@ Register TagPrefix="ew" Namespace="eWorld.UI" Assembly="eWorld.UI, Version=1.9.0.0, Culture=neutral, PublicKeyToken=24d65337282035f2" %> 
<!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 id="Head1" runat="server"> 
     <title> 
      Lista De Consumos 
     </title> 

     <link href="css/Style.css" type="text/css" rel="stylesheet"/> 

     <style type="text/css"> 
      #blur 
      { 
       width: 100%; 
       background-color: black; 
       moz-opacity: 0.5; 
       khtml-opacity: .5; 
       opacity: .5; 
       filter: alpha(opacity=50); 
       z-index: 120; 
       height: 100%; 
       position: absolute; 
       top: 0; 
       left: 0; 
      } 

      #progress 
      { 
       border: black 1px solid; 
       padding: 5px; 
       z-index: 100;     
       width: 250px; 
       position: absolute; 
       background-color: #fff; 
       -moz-opacity: 0.75; 
       font-family: Tahoma; 
       font-size: 11px; 
       font-weight: bold; 
       text-align: center; 
      } 
     </style> 

     <script type="text/javascript"> 
      function viewCalendars() 
      { 
       if (document.getElementById('ddlDates').value == '5') 
       { 
        document.getElementById('divSpecificDates').style.display = 'inline'; 
       } 

       else 
       { 
        document.getElementById('divSpecificDates').style.display = 'none'; 
       } 

       return; 
      } 
     </script> 
    </head> 

    <body onload="viewCalendars();"> 
     <form id="form1" runat="server"> 
      <asp:ScriptManager ID="sm" runat="server"> 
      </asp:ScriptManager> 

      <asp:UpdateProgress ID="UpdateProgress1" runat="server"> 
       <ProgressTemplate> 
        <div id="blur"> 
        </div> 
        <div id="progress"> 
         <asp:Image ID="imgLoading" GenerateEmptyAlternateText="true" runat="server" ImageUrl="~/images/loading.gif" /> 
        </div> 
       </ProgressTemplate> 
      </asp:UpdateProgress> 

      <asp:UpdatePanel ID="upd" runat="server"> 
       <ContentTemplate> 
        <asp:DropDownList ID="ddlDates" CssClass="tbox" runat="server"> 
        </asp:DropDownList> 

        <div runat="server" id="divSpecificDates" style="display: none; width: 100%; z-index: 1000;"> 
        </div> 

        &nbsp; 
        <asp:Button Text="Filtrar" CssClass="btn" runat="server" ID="btnFilter" onclick="btnFilter_Click" /> 
       </ContentTemplate> 

       <Triggers> 
        <asp:AsyncPostBackTrigger ControlID="btnFilter" EventName="Click" /> 
       </Triggers> 
      </asp:UpdatePanel> 
     </form> 
    </body> 
</html>

所以，我注意到，你点击btnFilter按钮后，它的功能将被触发，而的UpdateProgress是可见的，但它消失后（和btnFilter函数完成）divSpecificDates在它应该可见时不可见。我想我必须在做完所有事情之后调用viewCalendars（）...

如何以及在哪里必须调用此函数？

更新：我刚刚摆脱了的UpdateProgress的...它仍然没有工作，所以我想这个问题是不存在的......或许这是对的UpdatePanel

来源

2013-03-13 Victor

http://stackoverflow.com/a/1153002/1402923 – RobH 2013-03-13 20:33:53

当UpdatePanel的更新时， DOM正在发生变化，您需要重新运行您在加载页面时执行的初始化。这是通过添加UpdatePanel时asp.net包含的JavaScript函数完成的。因此，从身体上删除onload并使用pageLoad。

所以从这个线

<body onload="viewCalendars();">

除去在onload并添加此脚本

<script> 
    function pageLoad() { 
     viewCalendars(); 
    } 
</script>

类似how to keep javascripts after UpdatePanel partial postback
参考：Ajax Client Side Life Cycle Events

来源

2013-03-13 20:53:47 Aristos

我正在更新一些遗留系统，这正是我所寻找的。谢谢@Aristos – 2017-07-06 07:43:54

如何在UpdateProgress放置在ASP.NET c＃之后触发JavaScript事件？

回答

相关问题