Conditionally set properties of ASP.NET controls using the Template Columns and the Databinder

The Databinder class of the System.Web.UI namespace lets you dynamically create bindings between any property on an ASP.NET page, including server control properties, and a data source.

What does this mean? Basically, you can conditionally set properties of controls on an ASP.NET web page on the fly. For example, you run a query against an accounts table. The query returns a datatable where each row represents information for a different account. Some accounts are restricted and the value of their restricted column in the datatable is a 1. If the account is not restricted, the value is a 0.

You bind the DataTable to a DataGrid on your ASP.NET web page. You do not want to display the restricted column. Instead, along side each row containing a restricted account, you want to display an image of a lock.

You need a means of setting the image's visible property on the fly for each row in the DataGrid. You can set the DataGrid up with a TemplateColumn that contains an ASP:IMAGE tag to display the image. The HTML code below illustrates the template column with the image.

HTML showing the ASP.NET TemplateColumn and ASP:IMAGE tag.

   <asp:TemplateColumn>
      <HeaderStyle BorderWidth="0px" BorderStyle="None" BackColor="White">
      </HeaderStyle>
      <ItemStyle BorderWidth="0px" BorderStyle="None" BackColor="White">
      </ItemStyle>
      <ItemTemplate>
         <ASP:IMAGE id="Image1" runat="server" 
            visible = '<%# ShowImage(DataBinder.Eval(Container.DataItem, 
              "Restricted").ToString())%>' 
            imageurl="../Images/myImage.bmp">
         </ASP:IMAGE>
      </ItemTemplate>
   </asp:TemplateColumn>

The visible property of Image1 is set to the result of the ShowImage method which takes a single parameter. The parameter is the value of the Restricted column from the datatable that the datagrid is bound to. To reference the datatable column you use the Eval method of the Databinder as shown above.

Code for the ShowImage method used to set the image's visible property:

   Public Function ShowImage(ByVal restricted As String) As Boolean
      If restricted = 1 Then
         Return True
      Else
         Return False
      End If
   End Function

ShowImage is called for every row in the datatable and returns True or False based on the restricted database value. ShowImage must be declared Public so it is available to the .ASPX page.

You can use the Databinder to set any property. For instance, the following code sets the properties of the Hyperlink server control:

   <asp:TemplateColumn HeaderText="Policy #">
      <HeaderStyle HorizontalAlign="Left" BorderWidth="1px" BorderStyle="Solid" 
         BorderColor="Gray" VerticalAlign="Bottom">
      </HeaderStyle>
      <ItemStyle BorderWidth="1px" BorderStyle="Solid" BorderColor="DimGray"/>
      <ItemTemplate>
         <asp:HyperLink id="Hyperlink2" runat="server" 
            Text='<%# DataBinder.Eval(Container.DataItem, "AccountNo") %>' 
            NavigateUrl='<%# TargetPage(DataBinder.Eval(Container.DataItem, 
              "AccountNo")) 
              + "?AcctType=" + ddlAccountType.SelectedValue.ToString() %>'>
         </asp:HyperLink>
      </ItemTemplate>

The result is the account number is used for the text of the hyperlink and the link's URL is set to the result of the TargetPage function, which takes the AccountNo database value as a parameter, and the value of the ddlAccountType DropDownList control.