Click here to Skip to main content
15,885,782 members
Articles / Web Development / ASP.NET
Article

HTML Wait-Confirm Button Server Control

Rate me:
Please Sign up or sign in to vote.
3.50/5 (17 votes)
29 Jul 20021 min read 285.2K   2.1K   72   28
An article showing a quick way to create a custom control that will prompt the user before submitting, and then will change the text of the button to "Please Wait.." and the mouse cursor will change to an hourglass.

Introduction

I'm providing the source code for a simple derived control that will add some useful functionality. Our goal is to make a submit button that prompts for confirmation before submitting, and if the user confirms then change the text on the button and change the mouse cursor to an hourglass. It has only been tested in Internet Explorer versions 5-6.

There are really only a few sections. The first thing needed is to create a compiled class file that will contain the instructions to write out the client side javascript, write out the html button, and modify the button to run the javascript when clicked.

The javascript we are going to be creating will look like this:

JavaScript
<script language="javascript">
<!--
function __doConfirm(btnWaiter) {
if (confirm("Save changes to database?")) {
 btnWaiter.setAttribute("value","Please Wait...");
 document.body.style.cursor="wait";
 return true;
} return false; }
-->
</script>

Our button will call this boolean function (return __doconfirm(this);) and only submit if it returns true.

Might as well get right to the code. Our class file will look like this, overriding the OnPreRender event to register the script and set the onclick attribute to call the client side function.

VB
Public Class ConfirmWaitButton
    Inherits System.Web.UI.WebControls.Button

    Public _Message As String

    Public Property Message() As String
        Get
            Return _Message
        End Get
        Set(ByVal Value As String)
            _Message = Value
        End Set
    End Property

    Protected Overrides Sub OnPreRender(ByVal e As EventArgs)
        Page.RegisterClientScriptBlock( _
         "__doAlert", _
         "<script language="" javascript"">" & vbCrLf & _
         "<!--" & vbCrLf & _
         "function __doConfirm(btnWaiter) {" & vbCrLf & _
         "if (confirm(""" & _Message & """)) {" & vbCrLf & _
         " btnWaiter.setAttribute(""value"",""Please Wait..."");" & vbCrLf & _
         " document.body.style.cursor=""wait"";" & vbCrLf & _
         " return true;" & vbCrLf & _
         "} return false; }" & vbCrLf & _
         "-->" & vbCrLf & _
         "</script>" _
        )

        Me.Attributes("onclick") = "return __doConfirm(this);"

        MyBase.OnPreRender(e)
    End Sub

End Class

And there it is! that's all it takes to create your own wait/confirm button. Add this as a class file to your VS.NET project and add one to a page like this:

HTML
<%@ Register TagPrefix="MG" Namespace="vbProject" Assembly="vbProject" %>

<MG:ConfirmWaitButton id="btnConfirmUpdate" runat="server" Text="Update" 
                         Message="Save changes to database?">
</MG:ConfirmWaitButton>

You will have access to all of the System.Web.UI.WebControls.Button's events, such as OnClick(). That's it!

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
Web Developer
United States United States
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
GeneralRe: Broken when combined with validations controls Pin
Andy Smith12-Feb-03 4:54
Andy Smith12-Feb-03 4:54 
GeneralRe: Broken when combined with validations controls Pin
mgriffith30-Jul-02 12:07
mgriffith30-Jul-02 12:07 
GeneralRe: Broken when combined with validations controls Pin
Jax Login22-Aug-03 11:04
sussJax Login22-Aug-03 11:04 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.