How change button text dynamically in ASP.NET

Question

I want to change my button text dynamically using c# in asp.net. I also tried dynamic javascript alert popup, however it also shows after mail sent.

Currently i have;

 protected void btnSend_Click(object sender, EventArgs e)
    {
        btnSend.Text = "Sending.."; // Changing Button text
    ScriptManager.RegisterStartupScript(btnSend,GetType(), "Javascript", "javascript:helloWorld(); ", true); // Also popup javascript test output

         using (MailMessage mm = new MailMessage("[email protected]", "[email protected]"))
        {

            mm.Subject = "Dropped Mails";
            string body = Request.Form["email"];
            body+="<br>" + "<br>" + Request.Form["message"];
            mm.Body = body;
            mm.IsBodyHtml = true;
            SmtpClient smtp = new SmtpClient();
            smtp.Host = "smtp.office365.com";
            smtp.EnableSsl = true;
            NetworkCredential NetworkCred = new NetworkCredential("[email protected]", "Bensezer10.");
            smtp.UseDefaultCredentials = true;
            smtp.Credentials = NetworkCred;
            smtp.Port = 587;
            smtp.Send(mm);
        }
   }

and in aspx side;

<form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>

        <section class="cid-qKKEwJNZ1Q mbr-fullscreen mbr-parallax-background" id="header15-2p">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>

                                        <div>
                                            <table style="width: 100%; text-align: center; margin-top: 0px; height: 78px;">
                                                <tr>
                                                    <td style="text-align: center;">
                                                        <asp:Button ID="btnSend" runat="server" Text="SEND" Width="200px" BorderStyle="None" Height="60px" Font-Names="SF Pro Display" Font-Size="14pt" CssClass="ButtonClass" OnClick="btnSend_Click" />
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="btnSend" EventName="Click" />
                </Triggers>
            </asp:UpdatePanel>
        </section>
    </form>

Well, it changes the buttontext after sending mail function is completed which is 3 second later.

How can i make this dynamically ?

What is wrong with using btnSend.Text = "SEND COMPLETE"; after smtp.Send(mm);? — VDWWD
– VDWWD, Commented Feb 27, 2018 at 20:49
Ah I see. What you are trying to will not work. You cannot change a Button text twice in a single PostBack and show both results. You have to change the text to "Sending" with javascript an only "Send complete" in the method. — VDWWD
– VDWWD, Commented Feb 27, 2018 at 20:50

user991629 · Accepted Answer · 2018-02-27 20:50:43Z

2

You're changing the button text while the server is still processing the request. Only when the email has sent does the client receive the server's response and can actually display the results.

What you'd need to do is use JQuery/Javascript to change the button text before initiating a post back to the server via an ajax request and then update the text back once the server has finished sending the emails.

There's a much more detailed How To (as there are a fair few steps involved), to be found here.

answered Feb 27, 2018 at 20:50

user991629

535 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

john true Over a year ago

I also used java script however still it waits to mail sending. Edited my question

Faruq · Accepted Answer · 2018-02-27 21:05:05Z

1

You need to use javascript to update the button text. In its simplest form, add this OnClientClick="this.value = 'Sending....';" to your button.

<asp:Button ID="btnSend" OnClientClick="this.value = 'Sending....';" runat="server" Text="SEND" Width="200px" BorderStyle="None" Height="60px" Font-Names="SF Pro Display" Font-Size="14pt" CssClass="ButtonClass" OnClick="btnSend_Click" />

And in the code-behind:

protected void btnSend_Click(object sender, EventArgs e)
{
    using (MailMessage mm = new MailMessage("[email protected]", "[email protected]"))
    {
        // do your things...
    }
    btnSend.Text = "Sent";
}

answered Feb 27, 2018 at 21:05

Faruq

1,5311 gold badge14 silver badges25 bronze badges

Comments

Zizzipupp · Accepted Answer · 2019-10-28 16:31:42Z

1

In Chrome, I've seen that this.value = '...'; does not work when the page is rendered by IIS Express in Visual Studio 2019. In my case, what worked is:

<asp:LinkButton ID="myButton" runat="server" OnClick="doSomething()" OnClientClick="this.style.background='#36648B';this.text='Wait...';">Click!</asp:LinkButton>

answered Oct 28, 2019 at 16:31

Zizzipupp

1,3611 gold badge14 silver badges33 bronze badges

Comments

Vintage Coder · Accepted Answer · 2024-09-26 05:30:30Z

0

In .ASPX file

<asp:Button ID="btnSend" runat="server" Text='<%# BtnSendText %>'> Width="200px" BorderStyle="None" Height="60px" Font-Names="SF Pro Display" Font-Size="14pt" CssClass="ButtonClass" OnClick="btnSend_Click" />

In .ASPX.CS file

you can add in any of the page lifecycle events based on your requirements.

this.Page.Databind();

answered Sep 26, 2024 at 5:30

Vintage Coder

5211 gold badge7 silver badges10 bronze badges

Collectives™ on Stack Overflow

How change button text dynamically in ASP.NET

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related