UpdateProgress无效,无法显示,没有效果,js给你答案

来源:互联网 发布:海马玩模拟器mac版删 编辑:程序博客网 时间:2024/04/28 15:39

当按钮botton位于updatepannel的外面的时候,会导致UpdateProgress起不到作用!

<asp:UpdatePanel ID="UpdatePanel2" runat="server">            <ContentTemplate>                <asp:Label ID="Label1" runat="server" Text="Label" Width="204px"></asp:Label><br />            </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。所以里面的"更新中..."显示不出来。


再如:UpdateProgress的外面有div包围【divUpdateProgress】:

<div id="divUpdateProgress" style="position: absolute; right: 466px; top: 48px; height: 20px;">        <asp:UpdateProgress ID="UpdateProgress1" runat="server">            <ProgressTemplate>                <div style="font-size: 12px; color: Blue; background-color: #FFFFD6; border: solid 1px blue;">                    <img src="../Image/ajaxloader.gif" />                    数据加载中,请稍候                </div>            </ProgressTemplate>        </asp:UpdateProgress>    </div>

对应的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 == '<%=btnSearch.ClientID %>' || postBackElement.id == '<%=btnSearchOnProj.ClientID %>')             {                $get('divUpdateProgress').style.display = 'block';            }        }        function EndRequest(sender, args)         {            if (postBackElement.id == '<%=btnSearch.ClientID %>' || postBackElement.id == '<%=btnSearchOnProj.ClientID %>')             {                 $get('divUpdateProgress').style.display = 'none';            }        }    </script>

ps:谋事在人成事也在人,好好揣摩!



原创粉丝点击