Section 9.3. Adding Child Controls

9.3. Adding Child Controls

The UserInfoTable web part isn't interactive: the information flows only from the server to the browser. To make a web part that can interact with members :

1. Declare the web controls to display in the web part.

2. Override the CreateChildControls event to set control properties.

3. Add each control to the controls collection.

4. Render the child controls in the RenderWebPart event.

The following code demonstrates the steps to create a Sum web part containing a textbox to receive a series of numbers input, a command button to perform the calculation, and a label to display the result:

 ' 1) Declare child controls.      Dim _txt As New TextBox      Dim _br As New Literal      Dim WithEvents _btn As New Button      Dim _lbl As New Label      Dim _total As String Protected Overrides Sub CreateChildControls()      ' Create utility object for dimensions.      Dim u As Unit      ' 2) Set child control properties.      With _txt         .Width = u.Pixel(400)         .Height = u.Pixel(200)         .TextMode = TextBoxMode.MultiLine     End With     With _br         .Text = "<br>"     End With     With _btn         .Width = u.Pixel(60)         .Height = u.Pixel(30)         .Text = "Sum"         .ToolTip = "Click here to get total."     End With     With _lbl         .Width = u.Pixel(100)         .Height = u.Pixel(30)     End With     ' 3) Add the controls in the order to display them     Controls.Add(_txt)     Controls.Add(_br)     Controls.Add(_btn)     Controls.Add(_lbl) End Sub ' Display web part. Protected Overrides Sub RenderWebPart _   (ByVal output As System.Web.UI.HtmlTextWriter)     ' 4) Write controls to output stream.     RenderChildren(output) End Sub 

The RenderChildren method in step 4 renders the child controls collection to the output object. The order of the controls in the collection is preserved, so it's important that the controls are added in the correct order in step 3. Alternately, you can use the RenderControl method to write the controls to output one at a time in any order:

 ' Alternate approach, write controls one at a time.     Protected Overrides Sub RenderWebPart _       (ByVal output As System.Web.UI.HtmlTextWriter)         ' Use different order.         _lbl.RenderControl(output)         _br.RenderControl(output)         _txt.RenderControl(output)         _br.RenderControl(output)         _btn.RenderControl(output)      End Sub 

Using RenderControl makes it a little easier to intersperse HTML literal strings with the controls, but I try to avoid that. Instead, I tend to use literal controls such as _br in the preceding example. That's my attempt to keep control definitions organized.

The command button control ( _btn ) is declared WithEvents so that user actions raise events that can be handled in the web part's code. To respond to an event from a child control, create an event procedure with a Handles clause:

 Private Sub _btn_Click _        (ByVal sender As Object, ByVal e As System.EventArgs) _        Handles _btn.Click          ' Calculate the total.          _total = Sum().ToString          ' Display the total.          _lbl.Text = "Total: " & _total      End Sub      Public Function Sum() As Double          Dim total As Double          ' Make sure there are numbers to add.          If _txt.Text.Length Then              Dim arr As String()              arr = Split(_txt.Text, vbCr)              For Each itm As String In arr                  Try                      total &= Convert.ToDouble(itm)                  Catch ' Skip if not a number.                  End Try              Next           Else              total = 0           End If           Return total       End Function 

Sidebar 9-1. For C# Users

Visual C# doesn't have WithEvents or Handles clauses. Instead, associate the event with the handler, as shown here:

 _btn.Click += new EventHandler(_btn_Click); // C# 

At runtime, the Sum web part adds the series of numbers entered in the textbox and displays the result when the user clicks Sum, as shown in Figure 9-8.

animal 9-8. Responding to events from child controls