Preferred Language:

Listing 7.10 - AddressForm.ascx

Illustrates how to create an address form with a user control.

Listing 7.10 - AddressForm.ascx (C#)
Copy 

<%@ Control Language="C#" ClassName="AddressForm" %>
<script runat="server">

    public string Title
    {
        get { return ltlTitle.Text; }
        set { ltlTitle.Text = value; }
    }

    public string Street
    {
        get { return txtStreet.Text; }
        set { txtStreet.Text = value; }
    }

    public string City
    {
        get { return txtCity.Text; }
        set { txtCity.Text = value; }
    }

    public string State
    {
        get { return txtState.Text; }
        set { txtState.Text = value; }
    }

    public string PostalCode
    {
        get { return txtPostalCode.Text; }
        set { txtPostalCode.Text = value; }
    }
    
</script>

<fieldset>
<legend>
    <asp:Literal 
        ID="ltlTitle"
        Text="Address Form" 
        runat="server" />
</legend>

<div class="addressLabel">
<asp:Label  
    ID="lblStreet"
    Text="Street:"
    AssociatedControlID="txtStreet"
    Runat="server" />
</div>
<div class="addressField">
<asp:TextBox
    ID="txtStreet"
    Runat="server" />
<asp:RequiredFieldValidator
    ID="reqStreet"
    Text="(required)"
    ControlToValidate="txtStreet"
    Runat="server" />    
</div>

<br class="clear" />

<div class="addressLabel">
<asp:Label  
    ID="lblCity"
    Text="City:"
    AssociatedControlID="txtCity"
    Runat="server" />
</div>
<div class="addressField">
<asp:TextBox
    ID="txtCity"
    Runat="server" />
<asp:RequiredFieldValidator
    ID="reqCity"
    Text="(required)"
    ControlToValidate="txtCity"
    Runat="server" />    
</div>

<br class="clear" />

<div class="addressLabel">
<asp:Label  
    ID="lblState"
    Text="State:"
    AssociatedControlID="txtState"
    Runat="server" />
</div>
<div class="addressField">
<asp:TextBox
    ID="txtState"
    Runat="server" />
<asp:RequiredFieldValidator
    ID="reqState"
    Text="(required)"
    ControlToValidate="txtState"
    Runat="server" />    
</div>

<br class="clear" />

<div class="addressLabel">
<asp:Label  
    ID="lblPostalCode"
    Text="Postal Code:"
    AssociatedControlID="txtPostalCode"
    Runat="server" />
</div>
<div class="addressField">
<asp:TextBox
    ID="txtPostalCode"
    Runat="server" />
<asp:RequiredFieldValidator
    ID="RequiredFieldValidator1"
    Text="(required)"
    ControlToValidate="txtPostalCode"
    Runat="server" />    
</div>

<br class="clear" />

</fieldset>

The following page uses the AddressForm user control twice.

Listing 7.11 - CheckOut.aspx (C#)
Copy | Try This Code! 

<%@ Page Language="C#" %>
<%@ Register TagPrefix="user" TagName="AddressForm" Src="AddressForm.ascx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server">

    protected void btnSubmit_Click(object sender, EventArgs e)
    {
        // Show Billing Address Form Results
        ltlResults.Text = "<br />Billing Street: " + AddressForm1.Street;
        ltlResults.Text += "<br />Billing City: " + AddressForm1.City;
        ltlResults.Text += "<br />Billing State: " + AddressForm1.State;
        ltlResults.Text += "<br />Billing Postal Code: " + AddressForm1.PostalCode;

        ltlResults.Text += "<br /><br />";
        
        // Show Shipping Address Form Results
        ltlResults.Text += "<br />Shipping Street: " + AddressForm2.Street;
        ltlResults.Text += "<br />Shipping City: " + AddressForm2.City;
        ltlResults.Text += "<br />Shipping State: " + AddressForm2.State;
        ltlResults.Text += "<br />Shipping Postal Code: " + AddressForm2.PostalCode;
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <style type="text/css">
        html
        {
            background-color:silver;
            font:14px Georgia,Serif;
        }
        .content
        {
            background-color:white;
            width:600px;
            margin:auto;
            padding:20px;
        }
        .addressLabel
        {
            float:left;
            width:100px;
            padding:5px;
            text-align:right;
        }
        .addressField
        {
            float:left;
            padding:5px;
        }
        .clear
        {
            clear:both;
        }

    </style>
    <title>Checkout</title>
</head>
<body>
    <form id="form1" runat="server">
    <div class="content">
    
    <user:AddressForm
        id="AddressForm1"
        Title="Billing Address"
        Runat="server" />

    <br />

    <user:AddressForm
        id="AddressForm2"
        Title="Shipping Address"
        Runat="server" />

    <br />
    
    <asp:Button
        ID="btnSubmit"
        Text="Submit Form"
        OnClick="btnSubmit_Click" 
        Runat="server" />

    <hr />

    <asp:Literal
        id="ltlResults"
        Runat="server" />
    
    </div>
    </form>
</body>
</html>