NCS Logo - Click for home page Northstar Developer Center
Platforms
All Platforms
.NET Framework (1.x - 4.x)
Active Server Pages
ASP.NET
C#
SQL Server
VB.NET
Visual Basic

Keywords
.NET Data Types
.NET E-mail
.NET Events
.NET Functions
.NET Object Programming
.NET System.Configuration
.NET System.Diagnostics
.NET System.IO
.NET System.Net
.NET System.Net.Sockets
Active Data Objects
ASP Architecture
ASP Black Belt
ASP Built-in Functions
ASP Built-in Objects
ASP Debugging
ASP Performance
ASP Security
ASP Syntax
ASP.NET Authentication
ASP.NET Controls
ASP.NET Data Access
ASP.NET Features
ASP.NET Master Pages
ASP.NET Page Events
ASP.NET Security
ASP.NET ViewState
Atom
Certifications
COM, DCOM, COM+
Data Access
E-Mail
Errors
Exporting Data
HTML Tips
IIS
Object-Oriented Programming
RSS
SQL
Uncategorized ASP Tips
VB API Programming
VB Forms
VB Syntax
XML

Book Support
Visual Basic 6 Bible
ASP Bible
ASP Weekend Crash Course
ASP.NET At Work
Creating Web Services

Control the Layout Of Your Input Forms

Written by Eric Smith, Northstar Computer Systems LLC

Although many of your input forms will have a fixed number of fields, in some cases you'll need to vary the number and configuration of your controls. This article demonstrates how to control the layout of your form using a Repeater control and the ItemDataBound event to set various attributes on the controls.

The example form has a simple table that includes the following Repeater control:

<asp:Repeater ID="rptFields" runat="server">
   <ItemTemplate>
   <tr>
      <td align="right" ID="tdPrompt" runat="server"
          nowrap><%# Eval("Prompt") %>:</td>
      <td><asp:TextBox ID="txtValue" runat="server" />
      <input type="hidden" id="hdnFieldID"
             value='<%# Eval("pkFieldID") %>'
             runat="server" /></td>
   </tr>
   </ItemTemplate>
</asp:Repeater>

Behind the scenes, a table called FormFields (or something appropriate) has these fields:

pkFieldID - Primary Key, integer
Prompt - String, contains the prompt to prefix the field with
MaxLength - Integer, indicates maximum number of characters for the field
IsRequired - Bit, indicates whether field is required

In the initial Load event for the page, I retrieve a DataTable containing the fields from the database, and then I bind it to the Repeater like this:

rptFields.DataSource = fieldsDataTable;
rptFields.DataBind();

The key event handler to make this work is the ItemDataBound event handler. It looks something like this:

void rptParameters_ItemDataBound(object sender,
                                 RepeaterItemEventArgs e)
{
   if (e.Item.ItemType != ListItemType.Item && e.Item.ItemType
       != ListItemType.AlternatingItem)
      return;
   DataRow dr = ((DataRowView)e.Item.DataItem).Row;
   HtmlTableCell td = (HtmlTableCell)e.Item.FindControl("tdPrompt");
   if (Convert.ToBoolean(dr["IsRequired"]))
      td.Attributes["class"] = "popupreq";
   else
      td.Attributes["class"] = "popuptext";
   TextBox txt = (TextBox)e.Item.FindControl("txtValue");
   txt.MaxLength = Convert.ToInt32(dr["MaxLength"]);
}

The first thing you do is make sure that you are looking at an "Item" or "Alternating Item" template. This is because the ItemDataBound event handler is called for the Header and Footer templates, which you don't care about for this code. You then get the DataRow for the current item being bound. Next, you find the table cell that contains the prompt text and change the style to either 'popupreq' or 'popuptext'. In this example, the popupreq style uses bold face, while popuptext uses a non-bold font.

The next step is to find the TextBox control and configure the maximum length of the field. The hidden field in the HTML portion of the page will be populated automatically with the primary key of the field record, which will be used in the back-end code to properly store the data to the database.

When the user hits the Submit button, ASP.NET keeps the values that the user enters into each field and makes them available to the PostBack code. Reading the values is similar to setting them in ItemDataBound, as this snippet shows:

foreach (RepeaterItem ri in rptParameters.Items)
{
   hdn = (HtmlInputHidden)ri.FindControl("hdnFieldID");
   txt = (TextBox)ri.FindControl("txtValue");
   // Read hdn.Value or txt.Text for persistence code
}

The reason you stored the field ID is because this data will generally need to be put into a table related to the data being edited. The easiest way I've found to do this is to fill the hidden field with the field's number, which you can use later in a stored procedure or other method to save the field's data to the database.

Keywords: [ ASP.NET Controls ]

Publication Date: 8/8/2006, Last Update: 12/10/2010