TextBox Watermark Extender – Modal Popup AJAX Controls

Prerequisites

Case Study – Trauma Flow Database

Summary

I show how to use the TextBoxWatermarkExtender to put a watermark in text boxes. I also show a simple use of the AJAX ModalPopupExtender to display help information.

Topics Covered in this Video;

-Tabbed Dialogs
-Ajax Controls
-Textboxes and WaterMarks
-Watermark Extenders
-TargetControlID
-Modal Popups

Video 

Reference Materials

ucMechanismOfInjury.ascx

<%@ Control Language=”C#” AutoEventWireup=”true” CodeBehind=”ucMechanismOfInjury.ascx.cs” Inherits=”TraumaFlow.UserControls.ucMechanismOfInjury” %><%@ Register Assembly=”AjaxControlToolkit” Namespace=”AjaxControlToolkit” TagPrefix=”cc1″ %><table><tr>    <td>        <asp:CheckBoxList ID=”cblMain” runat=”server”             onselectedindexchanged=”cblMain_SelectedIndexChanged” AutoPostBack=”True”>        <asp:ListItem>AUTO</asp:ListItem>        <asp:ListItem>MC</asp:ListItem>        <asp:ListItem>FALL</asp:ListItem>        <asp:ListItem >GSW</asp:ListItem>        <asp:ListItem>STAB</asp:ListItem>        <asp:ListItem>BICYCLE</asp:ListItem>        <asp:ListItem>CRUSH</asp:ListItem>        <asp:ListItem>BURN</asp:ListItem>        <asp:ListItem>OTHER</asp:ListItem>        </asp:CheckBoxList>        </td>        <td >                        <asp:CheckBoxList ID=”cblAuto” runat=”server” Visible=”false”>            <asp:ListItem>Driver</asp:ListItem>            <asp:ListItem>Passenger</asp:ListItem>            <asp:ListItem>Pedestrian</asp:ListItem>                        </asp:CheckBoxList>                        <asp:RadioButtonList ID=”rblHelmet” runat=”server” Visible=”false”>            <asp:ListItem>No Helmet</asp:ListItem>            <asp:ListItem>1/2</asp:ListItem>            <asp:ListItem>3/4</asp:ListItem>            <asp:ListItem>Full</asp:ListItem>            </asp:RadioButtonList>            <asp:CheckBox ID=”cbSeatbelt” runat=”server” Visible=”false” Text=”Seatbelt?” /><br />            <asp:CheckBox ID=”cbAirbag” runat=”server” Visible=”false” Text= “Airbag?” /><br />        <asp:TextBox ID=”tbSpeed” runat=”server” Visible=”false”></asp:TextBox>           <cc1:TextBoxWatermarkExtender ID=”tbweSpeed” runat=”server” WatermarkText=”Speed” TargetControlID=”tbSpeed”>           </cc1:TextBoxWatermarkExtender><br />                  <asp:TextBox ID=”tbFall” runat=”server” Visible=”false”></asp:TextBox>            <cc1:TextBoxWatermarkExtender ID=”tbweFallInfo” runat=”server” WatermarkText=”Fall Information” TargetControlID=”tbFall”>            </cc1:TextBoxWatermarkExtender><br />        <asp:TextBox ID=”tbCaliber” runat=”server” Visible=”false”></asp:TextBox>            <cc1:TextBoxWatermarkExtender ID=”tbweCaliber” runat=”server” WatermarkText=”Caliber” TargetControlID=”tbCaliber”>            </cc1:TextBoxWatermarkExtender><br />        <asp:TextBox ID=”tbOther” runat=”server” Visible=”false”></asp:TextBox>            <cc1:TextBoxWatermarkExtender ID=”tbweOther” runat=”server” WatermarkText=”Other Injury” TargetControlID=”tbOther”>            </cc1:TextBoxWatermarkExtender>        </td>        </tr>        </table><br /><asp:Button ID=”btnSubmit” runat=”server” Text=”Submit”     onclick=”btnSubmit_Click” /><asp:Button ID=”btnHelp” runat=”server” Text=”Help” /><cc1:ModalPopupExtender ID=”mpeHelp”  runat=”server” TargetControlID=”btnHelp”    CancelControlID=”btnCancel” OkControlID=”btnOkay”     PopupControlID=”Panel1″ BackgroundCssClass=”helpBackground” X=”400″ Y=”100″></cc1:ModalPopupExtender><asp:panel id=”Panel1″ style=”display: none” runat=”server”>                    <div class=”PopupHeader” id=”PopupHeader”>Header</div>                <div class=”PopupBody”>                    <p>This is a simple modal dialog – You can insert text here</p>                </div>                <div class=”Controls”>                    <input id=”btnOkay” type=”button” value=”Done” />                    <input id=”btnCancel” type=”button” value=”Cancel” />                </div>        </asp:panel>

ucMechanismOfInjury.ascx.cs

using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;namespace TraumaFlow.UserControls{    public partial class ucMechanismOfInjury : System.Web.UI.UserControl    {        protected void Page_Load(object sender, EventArgs e)        {        }        protected void cblMain_SelectedIndexChanged(object sender, EventArgs e)        {            // 0 – AUTO   1 – MC   2 – FALL   3 – GSW            // 4 – STAB   5 – BICYCLE 6 – CRUSH   7 – BURN   8 – OTHER            if (cblMain.Items[0].Selected) // Auto            {                cblAuto.Visible = true;                tbSpeed.Visible = true;                cbSeatbelt.Visible = true;                cbAirbag.Visible = true;            }            else            {                cblAuto.Visible = false;                tbSpeed.Visible = false;                cbSeatbelt.Visible = false;                cbAirbag.Visible = false;            }            if (cblMain.Items[1].Selected) // Motorcycle            {                rblHelmet.Visible = true;                tbSpeed.Visible = true;            }            else            {                rblHelmet.Visible = false;                tbSpeed.Visible = cblMain.Items[0].Selected;            }            if (cblMain.Items[2].Selected) // Fall                tbFall.Visible = true;            else                tbFall.Visible = false;            if (cblMain.Items[3].Selected)                tbCaliber.Visible = true;            else                tbCaliber.Visible = false;            if (cblMain.Items[8].Selected) // Other                tbOther.Visible = true;            else                tbOther.Visible = false;                       string s = String.Empty;            for (int j = 0; j < cblMain.Items.Count; j++)            {                if (cblMain.Items[j].Selected) s += cblMain.Items[j].Value + “;”;            }        }        protected void btnSubmit_Click(object sender, EventArgs e)        {        }    }}

Additional Information