|
With the Header control you saw that a user control is just a special ASP .NET page, and can contain other controls. You also saw with the above dice example, how you can have multiple copies of the same user control on one page. The question you might ask is how, if you have multiple copies of a control, you access the controls within it? For example, consider online purchasing, where you have to fill in both a home address and a delivery address. The fields for both addresses are exactly the same, so this is a good case for a user control.
Let's assume we have a user control that contains three TextBoxes – txtAddress, txtCity, and txtPostalCode. We drop that onto our page and call it HomeAddress. One would expect that you should be able to access these inner controls like so:
HomeAddress.txtAddress.Text
However, if you try that what you get the following compiler error:
Compiler Error Message: BC30390: 'ASP.Address_ascx.txtAddress' is not accessible in this context because it is 'Protected'.
This is because you can't access the controls with the user control directly. We have to do what we did with the header control and use a property as an intermediary between the inner control and the page that the user control sits on. Let's look at how we do this, especially when we use multiple copies of the same control.
Create a new ASP.NET User Control from the Add New File dialog, called address.ascx.
Add some Label and TextBox controls so it looks like this:
Change the ID properties of these controls to txtAddress, txtCity, and txtPostalCode. Set the TextMode property of txtAddress to MultiLine.
Switch to Code view and add the following:
Public Property Address As String Get Return txtAddress.Text End Get Set txtAddress.Text = Value End Set End Property Public Property City As String Get Return txtCity.Text End Get Set txtCity.Text = Value End Set End Property Public Property PostalCode As String Get Return txtPostalCode.Text End Get Set txtPostalCode.Text = Value End Set End Property
Save the control and close it.
Create a new ASP.NET Page called purchase.aspx.
Drag two copies of address.ascx onto the page. You might like to use an HTML table to line them up next to each other, perhaps with some header text. Change the ID properties to HomeAddress and DeliveryAddress.
Add a Button underneath the address controls, and change the Text property to Show Addresses.
Finally add two Label controls. You should have something similar to the following:
Double-click the Button and add the following code:
Sub Button1_Click(sender As Object, e As EventArgs) Label1.Text = "Home address is:<br />" & _ HomeAddress.Address & "<br />" & _ HomeAddress.City & "<br />" & _ HomeAddress.PostalCode Label2.Text = "Delivery address is:<br />" & _ DeliveryAddress.Address & "<br />" & _ DeliveryAddress.City & "<br />" & _ DeliveryAddress.PostalCode End Sub
Save the file and run it.
Add some details into all of the text fields and press the button:
The important point about how this works is to remember that to provide access to controls within a user control you have to add public properties. Hence the property for each of the TextBox controls:
Public Property Address As String ... Public Property City As String ... Public Property PostalCode As String ...
This technique has the added benefit of hiding the internal implementation of the user control, allowing access to its functionality through easy-to-understand names.
The second stage is the use of two copies of the user control. Because there are two distinct copies, with separate names, the internal controls and properties are also distinct. This allows us to access them as individual controls, even though they are based on just one control description:
Label1.Text = "Home address is:<br />" & _ HomeAddress.Address & "<br />" & _ HomeAddress.City & "<br />" & _ HomeAddress.PostalCode Label2.Text = "Delivery address is:<br />" & _ DeliveryAddress.Address & "<br />" & _ DeliveryAddress.City & "<br />" & _ DeliveryAddress.PostalCode
To understand what this is doing, let's take another look at the property for the Address:
Public Property Address As String Get Return txtAddress.Text End Get Set txtAddress.Text = Value End Set End Property
This stores and retrieves values in the TextBox called txtAddress. When we fetch the address (as we do to display it on our main page), we are actually calling the Get part of the property, which 'gets' the value stored in the TextBox. We could do the opposite to set the address:
DeliveryAddress.Address = "4 High Street"
This would call the Set part of the property, which pushes the Value we've supplied into
the TextBox.
|