UpdateProgress使用小结

本文介绍在使用ASP.NET AJAX的UpdateProgress控件时遇到的问题及解决方案。当使用Triggers外部调用按钮触发UpdatePanel更新时,UpdateProgress控件无法正常显示“更新中...”。通过添加自定义JavaScript代码,可以成功实现UpdateProgress的显示。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 今天迈开学习AJAX的第一步,先大概的使用了一下自带的五个控件。在使用UpdateProgress控件的时候遇到一个小问题。现在还不知道为什么,以后知道再补到下面来。
首先我在updatePanel里面放了一个Button和Label,然后点击Button给Label赋值。这个是个很简单的过程了。
代码我就补贴了。
然后我再加了一个UpdateProgress控件,把它的AssociatedUpdatePanelID指向刚加的UpdatePanel,其代码如下:
 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            
<ContentTemplate>
            
<asp:Label ID="Label1" runat="server" Text="Label" Width="204px"></asp:Label><br />
            
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
            
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="1">
            
<ProgressTemplate >
             
<p>
                 更新中......
             
</p>
            
</ProgressTemplate>
            
</asp:UpdateProgress>
            
</ContentTemplate>
        
</asp:UpdatePanel>
Button事件:
protected void Button1_Click(object sender, EventArgs e)
    {
        System.Threading.Thread.Sleep(3000);
        Label1.Text = DateTime.Now.ToString();
    }
运行结果正常,点击Button,“更新中...”出现,然后Label被赋值。

然后我把updateProgress拿到updatePanel控件外面来,运行,正常。
然后我再把button控件拿到updatePannel控件外面来,然后又在updatepanel里面加上triggers,代码如下:
 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            
<ContentTemplate>
            
<asp:Label ID="Label1" runat="server" Text="Label" Width="204px"></asp:Label><br />
                
&nbsp;&nbsp;&nbsp; &nbsp;
            
</ContentTemplate>
            
<Triggers>
                
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
            
</Triggers>
        
</asp:UpdatePanel>
            
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" Width="201px" />
            
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="1">
            
<ProgressTemplate >
             
<p>
                 更新中......
             
</p>
            
</ProgressTemplate>
            
</asp:UpdateProgress>
运行,点击Button按钮,发现"更新中..."字段没有出现,但是赋值正常。
难道使用triggers的调用外部控件来进行异步传输,不会引发UpdateProgress?

后来在网上找到了解决方法:
在代码里面加入如下js:
<script language="javascript" type="text/javascript">
    
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';
        }


}

    
</script>
 
然后运行正常,从上面的js可以看出,如果是triggers触发的button事件,那么progress控件的style.display始终都是none,在button_click事件触发时,并没有使progress的 style.display变成block。所以里面的"更新中..."显示不出来。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值