Example E493
Visible to All Users

Popup Control for ASP.NET Web Forms - How to add buttons to a pop-up window

This example demonstrates how to add buttons to a Popup Control's window.

Add buttons to a popup window

Overview

In this example, a pop-up window contains a textbox editor with OK and Cancel buttons. The Cancel button processes the Click event on the server, while the OK button processes its Click event on the server and client.

Files to Look At

Documentation

More Examples

Example Code

WebSite/Default.aspx
ASPx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <%@ Register Assembly="DevExpress.Web.v21.2, Version=21.2.13.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web" TagPrefix="dx" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>How to implement OK and Cancel buttons for a modal popup window</title> </head> <body> <form id="form1" runat="server"> <div> <dx:ASPxTextBox ID="ASPxTextBox1" runat="server" Width="170px" ClientInstanceName="txtMain" ClientEnabled="False" Text="test message"> </dx:ASPxTextBox> <dx:ASPxButton ID="ASPxButton1" runat="server" Text="Edit..." AutoPostBack="False"> <ClientSideEvents Click="function(s, e) { txtPopup.SetText(txtMain.GetText()); popupControl.Show(); }" /> </dx:ASPxButton> <dx:ASPxPopupControl ID="ASPxPopupControl1" runat="server" ClientInstanceName="popupControl" Height="83px" Modal="True" CloseAction="CloseButton" Width="207px" AllowDragging="True" PopupHorizontalAlign="WindowCenter" PopupVerticalAlign="WindowCenter"> <ContentCollection> <dx:PopupControlContentControl runat="server"> Text:<dx:ASPxTextBox ID="ASPxTextBox2" runat="server" Width="170px" ClientInstanceName="txtPopup"> </dx:ASPxTextBox> <br /> <br /> <table style="border: none"> <tr> <td> <dx:ASPxButton ID="btnOK" runat="server" AutoPostBack="False" Text="OK" Width="80px" OnClick="btnOK_Click"> <ClientSideEvents Click="function(s, e) { popupControl.Hide(); // Processes data on the client e.processOnServer = true; // Processes data on the server }" /> </dx:ASPxButton> </td> <td> <dx:ASPxButton ID="btnCancel" runat="server" AutoPostBack="False" ClientInstanceName="btnCancel" Text="Cancel" Width="80px"> <ClientSideEvents Click="function(s, e) { popupControl.Hide(); }" /> </dx:ASPxButton> </td> </tr> </table> </dx:PopupControlContentControl> </ContentCollection> </dx:ASPxPopupControl> </div> </form> </body> </html>
WebSite/Default.aspx.cs(vb)
C#
using System; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void btnOK_Click(object sender, EventArgs e) { // Processes data on the server ASPxTextBox1.Text = ASPxTextBox2.Text; } }

Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.