如何在asp.net中为特定控件弹出加载面板

时间:2012-06-29 19:12:12

标签: asp.net ajax

我正在使用c#处理asp.net和ajax。我试图在用户点击按钮时弹出加载面板。 Mu表单包含3个文本框和一个下拉列表(autopostback = true)和一个提交按钮。我使用以下代码。

 <asp:UpdatePanel ID="updatepanel1" runat="server">
    <ContentTemplate>   
     <asp:TextBox runat="server" ID="txtMI" Width="80px" Height="20px" CssClass="s1">                                       </asp:TextBox>
<asp:TextBox runat="server" ID="txtMI" Width="80px" Height="20px" CssClass="s1"></asp:TextBox>
<asp:TextBox runat="server" ID="txtMI" Width="80px" Height="20px" CssClass="s1"></asp:TextBox>
        <asp:Dropdownlist ID="drpCountries" runat="server" Font-Bold="True" ForeColor="#FF3300"></asp:Dropdownlist>
        <br />
        <asp:Button ID="btnLoad" runat="server" onclick="btnLoad_Click" Text="submit" />
        </ContentTemplate>
        </asp:UpdatePanel>

我的updateprogress代码是:

 <asp:UpdateProgress id="updateProgress" runat="server">
     <ProgressTemplate>
            <div style="position: fixed; text-align: center; height: 100%; width: 100%; top: 0; right: 0; left: 0; z-index: 9999999; background-color: #000000; opacity: 0.7;">
                    <asp:Image ID="imgUpdateProgress" runat="server" ImageUrl="~/avatarloading.gif" AlternateText="Loading ..." ToolTip="Loading ..." style="padding: 10px;position:fixed;top:25%;left:35%;" /><center><span style="color:White;font-weight:bolder;font-size:x-large;"><b>Loading...</b></span></center>
            </div>
     </ProgressTemplate>

</asp:UpdateProgress>

当我点击提交按钮时,我需要弹出加载面板。但是当我在下拉列表中选择一个项目时,它也会弹出加载面板。当我单击使用ajax的提交按钮时,我怎么能弹出加载面板。请指导我。

1 个答案:

答案 0 :(得分:0)

两件事: 您的DDL没有AutoPostBack = true并尝试修改更新进度的AssociatedUpdatePanelID属性。回发也可能发生得非常快,您无法看到更新进度的最新情况。无论如何,我会检查它是否正在击中OnSelectedIndexChanged事件,如果是,请让线程休眠几秒钟,看看你现在是否可以看到加载弹出。这就是我作为示例项目为自己工作的原因:

代码背后:

public partial class _Default : System.Web.UI.Page
{
    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        System.Threading.Thread.Sleep(5000);
    }
}

HTML:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
                    <asp:ListItem>Item 1</asp:ListItem>
                    <asp:ListItem>Item 2</asp:ListItem>
                </asp:DropDownList>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
            <ProgressTemplate>
                Loading.....</ProgressTemplate>
        </asp:UpdateProgress>
    </div>
    </form>
</body>
</html>
祝你好运。