Create a customized alert box in c# asp.net

You can't use asp:Button in JavaScript alert, The best way to make an alert or modal dialog box in asp.net is to create your own and make it hidden or in-active in master page and call it when you need it.

You can get a ready made modal or alert in GetBootstrap

Update: Here some Idea how to use bootstrap modal.

This is how I use GetBootstrap Modal for asp.net webforms, you can use it if you want.

The following code is use to create a customize alert or modal box with proper asp.net button controls that you can use in back-end. "you can place this in master page to prevent repetitive"

<asp:Panel ID="pnlAlertBox" runat="server" style="position:absolute;top:0;> //You can make is visible or hidden -- you need to customize the style of panel
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title" id="myModalLabel">This is customize alertbox</h4>
                </div>
                <div class="modal-body">
                    This is the messages...
                </div>
                <div class="modal-footer">
                    <asp:Button ID="btnCancel" runat="server" CssClass="btn btn-default" Text="Cancel" />
                    <asp:Button ID="btnOk" runat="server" CssClass="btn btn-primary" Text="Ok" />
                </div>
            </div>
        </div>
</asp:Panel>

But of course you need to include the getboostrap .js and .css files in master page to show the design.

Place this in header:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">

Place this after form:

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>

This is a fixed version of Abrar Jahin's answer. Calling e.preventDefault() prevents the default action being taken, which is to submit the form.

The following displays the alert on click, and then submits the form: -

$("#alert_button").click( function(e)
{
    alert('This is a custom alert box', 'Alert Dialog');
});

EDIT:

If you want to call a specific function in your webpage, you have a few options: -

• A PageMethod or HttpHandler
• in your client-side code, call the ASP.NET-generated __doPostback function, and pass parameters indicating what to do to your server-side code

without redirect page alert code

ScriptManager.RegisterStartupScript(this, this.GetType(), "showalert", "alert('Demo');", true);

with redirect page

 ScriptManager.RegisterStartupScript(this, this.GetType(), "err_msg", "alert('Demo');window.location='Demo.aspx';", true);

You can use javascript inside OnClientClick event handler for the button

<asp:Button ID="Button1" runat="server" Text="Delete User" 
     OnClientClick="return  confirm('Are you sure you want to delete this user?');" />