# Use Custom Controls on Reports

Learn how to enhance your code-based section reports by integrating third-party controls. This guide demonstrates using hidden text boxes to populate a Visual Studio TreeView.

## Content



In a Section Report, ActiveReports allows you to drop a third party control onto the report design surface where it is recognized as a custom control. You can access its properties using type casting.

In the following steps, we use hidden textbox controls to populate a Visual Studio TreeView control. These steps assume that you have already added a code-based Section Report template in a Visual Studio project.

## Add the TreeView control to a report

1.  From the Visual Studio toolbox **Common Controls** tab, drag and drop a **TreeView** control onto the detail section of a report.
2.  Notice that in the Properties window, the control is called **CustomControl1**.

## Add data and hidden TextBox controls to the report

1.  Connect the report to the JSON data [Orders](https://demodata.mescius.io/northwind/odata/v1/Orders).
2.  From the Report Explorer, drag and drop the following fields onto the detail section of the report:
    *   ShipCountry
    *   ShipCity
    *   CustomerId
    *   EmployeeId
3.  On the design surface, select all four TextBox controls, and in the Properties window, change their **Visible** property to **False**.

## Create a function to add nodes to the TreeView control

1.  Right-click the design surface and select **View Code** to see the code view for the report.
2.  Add the following code inside the report class to add a function to the report for adding nodes to the TreeView control.
    
    The following examples show what the code for the function looks like.
    
    ```vbnet
    Private Function AddNodeToTreeView(ByVal colNodes As TreeNodeCollection, ByVal sText As String) As TreeNode
       Dim objTreeNode As TreeNode
       objTreeNode = New TreeNode(sText)
       colNodes.Add(objTreeNode)
       Return objTreeNode
    End Function
    ```
    
    ```csharp
    private TreeNode AddNodeToTreeView(TreeNodeCollection colNodes, string sText)
    {
        TreeNode objTreeNode;
        objTreeNode = new TreeNode(sText);
        colNodes.Add(objTreeNode);
        return objTreeNode;
    }
    ```
    

## Access the TreeView control properties in code and assign data

1.  On the report design surface, double-click the detail section to create an event-handling method for the **Detail\_Format** event.
2.  Add the following code to the handler to access the **TreeView** properties and assign data from the hidden TextBox controls.
    
    The following example shows what the code for the method looks like.
    
    ```vbnet
    'Type cast the custom control as a TreeView
    Dim TreeView1 As New TreeView
    TreeView1 = CType(Me.CustomControl1.Control, TreeView)
    'Create a tree node
    Dim objCountryTreeNode As TreeNode
    'Assign the text from a hidden textbox to the node
    objCountryTreeNode = AddNodeToTreeView(TreeView1.Nodes, Me.txtShipCountry1.Text)
    'Add a second-level node
    AddNodeToTreeView(objCountryTreeNode.Nodes, Me.txtShipCity1.Text)
    'Expand the top-level node so the second-level node is in view
    objCountryTreeNode.Expand()
    'Create a second top-level node
    Dim objCustomerTreeNode As TreeNode
    objCustomerTreeNode = AddNodeToTreeView(TreeView1.Nodes, Me.txtCustomerId1.Text)
    AddNodeToTreeView(objCustomerTreeNode.Nodes, Me.txtEmployeeId1.Text)
    objCustomerTreeNode.Expand()
    ```
    
    ```vbnet
    //Type cast the custom control as a TreeView TreeView TreeView1 = new TreeView();TreeView1 = (TreeView)this.customControl1.Control;
    //Create a tree node TreeNode objCountryTreeNode;//Assign the text from a hidden textbox to the node objCountryTreeNode = AddNodeToTreeView(TreeView1.Nodes, this.txtShipCountry1.Text);//Add a second-level node AddNodeToTreeView(objCountryTreeNode.Nodes, this.txtShipCity1.Text);//Expand the top-level node so the second-level node is in view objCountryTreeNode.Expand();
    //Create a second top-level node TreeNode objCustomerTreeNode;objCustomerTreeNode = AddNodeToTreeView(TreeView1.Nodes, this.txtCustomerId1.Text);AddNodeToTreeView(objCustomerTreeNode.Nodes, this.txtEmployeeId1.Text);objCustomerTreeNode.Expand();
    ```
    

## Load the report in the Viewer, change the Form Load event

```vbnet
Dim ar = New SectionReport1()
 ar.Run(False)
 viewer1.LoadDocument(ar.Document)
```

```csharp
var ar = new SectionReport1();
 ar.Run(false);
 viewer1.LoadDocument(ar.Document);
```