Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Updating ASP.NET label after button click, using UpdatePanel

I'm trying to have two things happen when I click on a button in an ASP.NET page:

  1. Change the text in an ASP:Label.
  2. Disable the button.

I've done a lot of research on this, but I've had difficulties doing either.

For #1, I thought that this should work, but it doesn't:

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">


    Protected Sub BtnSubmit_Click(sender As Object, e As System.EventArgs)
        Label1.Text = "Working..."

        System.Threading.Thread.Sleep(5000)

        Label1.Text = "Done."

    End Sub
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <ajaxToolkit:ToolkitScriptManager runat="server" />
    <div>
        <asp:ListBox runat="server" Height="100px" />
        <br />
        <asp:UpdatePanel runat="server">
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="BtnSubmit" EventName="Click" />
            </Triggers>
            <ContentTemplate>
                <asp:Label ID="Label1" runat="server" Text="Press the button" />
            </ContentTemplate>
        </asp:UpdatePanel>
        <br />
        <asp:Button runat="server" ID="BtnSubmit" OnClick="BtnSubmit_Click" Text="Submit Me!" />
    </div>
    </form>
</body>
</html>

The "Working..." message is never displayed.

As for #2, I added this to the button (I forget where I found it):

OnClientClick="this.disabled = true; this.value = 'Working...';"
            UseSubmitBehavior="false"

That had the desired effect of disabling the button and changing its text (value), but it wasn't possible to change it back using Text and Enabled properties.

like image 405
rht341 Avatar asked Jun 21 '11 17:06

rht341


1 Answers

I just found a solution on msdn (http://msdn.microsoft.com/en-us/library/bb386518.aspx). Added some code and remove some unnecessary parts.

<%@ Page Language="C#"  %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
protected void btnDoWork_Click(object sender, EventArgs e)
{
    /// do something long lasting
    System.Threading.Thread.Sleep(3000);
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <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 == 'btnDoWork') {
            $get('btnDoWork').value = 'Working ...';
            $get('btnDoWork').disabled = true;
        }
    }
    function EndRequest(sender, args) {
        if (postBackElement.id == 'btnDoWork') {
            $get('btnDoWork').value = 'Done!';
            $get('btnDoWork').disabled = false;
        }
    }
    // -->
    </script>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:Label ID="Label1" runat="server" Text="Hello World!"></asp:Label><br />
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnDoWork" />
        </Triggers>
    </asp:UpdatePanel>
    <asp:Button ID="btnDoWork" runat="server" Text="Start!" OnClick="btnDoWork_Click" />
</div>
</form>
</body>
</html>

What you basically do, is you register some eventHandler for Initialize_ and End_Request - in those you disable and enable your button!

HTH

like image 188
Pilgerstorfer Franz Avatar answered Nov 15 '22 06:11

Pilgerstorfer Franz