ajax UpdateProgress 不显示

今天用了 UpdateProgress ,但是UpdatePanel更新时,其内容不显示,原因居然是触发键在 UpdatePanel 外。。。无语中...

解决方法参考下文:

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <%=DateTime.Now %><asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Button1" />
            </Triggers>
        </asp:UpdatePanel>
        
        <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
            <ProgressTemplate>
                <span>123</span>
            </ProgressTemplate>
        </asp:UpdateProgress>
        <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <%=DateTime.Now %><asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button1_Click" />
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Button2" />
            </Triggers>
        </asp:UpdatePanel>
        
        <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
            <ProgressTemplate>
                <span>321</span>
            </ProgressTemplate>
        </asp:UpdateProgress>


上面的代码是实现,点击Button1显示123 ,点击Button2显示321,

关键点在于 Button位置,如果Button在<ContentTemplate>中,则UpdateProgress中的内容可以显示,如果说Button的位置在<ContentTemplate>外,既UpdatePanel的外部的话,UpdateProgress中的内容就不会显示了!

方法二:

如果Button的位置必需在UpdatePanel的外部的话,就得运用PageRequestManager中的initializeRequest事件和endRequest事件,代码如下:


<Triggers>
    <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Event"/>
</Triggers>

var prm = Sys.WebForms.PageRequestManager.getInstance(); 
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
var postBackElement;
function InitializeRequest(sender, args)
{ 
  if (prm.get_isInAsyncPostBack())
  args.set_cancel(true);
  postBackElement = args.get_postBackElement(); 

  if (postBackElement.id == 'Button1')
  $get('UpdateProgress1').style.display = 'block';
}
function EndRequest(sender, args)
{ 
  if (postBackElement.id == 'Button1')
  $get('UpdateProgress1').style.display = 'none'; 
}

来源:http://www.cnblogs.com/wangduck/archive/2008/11/17/AssociatedUpdatePanelID.html





你可能感兴趣的:(Ajax,server,function,asp,button,triggers)