All geek questions in one place

Updating an ASP.NET tag after a button is clicked using UpdatePanel

I try to do two things when I click a button on an ASP.NET page:

  • Change the text in ASP: Label.
  • Disable button.

I did a lot for this, but I also had difficulties.

For # 1, I thought this should work, but it is not:

<%@ 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 message "Work ..." is never displayed.

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

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

This had the desired effect of disabling the button and changing its text (value), but it was impossible to change it using the "Text" and "Enabled" properties.

+6
source share
5 answers

ASP will not clear the result from the browser during operation, even if you use the UpdatePanel. He will finish workb (including sleep) before flushing.

You can use UpdateProgress to display the text "Working ..".

 <asp:UpdateProgress>

This will show its contents while UpdatePanel is running. Once the UpdatePanel is finished, the contents will disappear.

What you need in you ClickEvent:

 Label1.Text = "Done." btnSubmit.Enabled = false

This will display the text “Finish” and disable the button. And let the UpdateProgress disappear.

0
source

I just found a solution on msdn ( http://msdn.microsoft.com/en-us/library/bb386518.aspx) . Added code and removed 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 do you basically do, do you register the eventHandler event for Initialize _ and End_Request - in those that you disable and activate your button!

NTN

+5
source

A working message is never displayed because you are executing a script on a server that does not respond to the client until the method exits.

ASP.NET AJAX has a built-in control for displaying such messages while the UpdatePanel is waiting on the server.

Check out the UpdateProgress control:

 <asp:UpdateProgress runat="server" id="progress" ><ProgressTemplate>Working...</ProgressTemplate></asp:UpdateProgress>

You can disable the button by setting the Enabled property to false in your server-side method.

 BtnSubmit.Enabled = false
0
source

@ 1: you will never see the message “Work” when you stopped the thread. Each message will be shown when your process is "finished".

@ 2: you encoded clientSide to disable the button, there is no code to re-enable your button

Hth

0
source

Firstly, the “work” never appears because the final label value during the post-back is “Done”. Think about what’s going on here - you click the button that calls the server back. It processes a post-back, which includes the launch of a button click code, the result of which is then sent back to the browser. Your "working" text never returns it by wire.

I don’t understand what you are trying to accomplish using the client code, but in order to describe that you are using the server side there:

 Protected Sub BtnSubmit_Click(sender As Object, e As System.EventArgs) Label1.Text = "Done." btnSubmit.Enabled = false End Sub

In addition, but your button inside the tags of the update panel template is so involved in ajax-postback.

-1
source

Source: https://habr.com/ru/post/891041/

More articles:


All Articles