The GEN:Table tag displays data from a database on the generated page. The data on the table can be retrieved from a database table, a database view or a custom query. You can specify the table or the custom query in the tag’s Properties dialog.
|
|
The Table tag, used in conjunction with FieldValue and ItemTemplate tags, produces attractive tabular data presentations. |
The Table tag functions much like an enclosing Record tag in that it groups together related tags for display within a data grid control. FieldValue tags are often used inside of a surrounding Table tag. The Table tag iterates through the selected data result set, displaying the contents of each successive row in the data grid.
<HTML>
<body>
<GEN:Table Name="Customer">
<table> <!-- HTML table tag -->
<tr>
<td colspan=100>
<B>Our Best Customers</B>
</td>
</tr>
<GEN:ItemTemplate>
<tr> <!-- Row in a table -->
<td><GEN:FieldValue Name="CompanyName"/></td>
<td><GEN:FieldValue Name="Address"/></td>
<td><GEN:FieldValue Name="City"/></td>
<td><GEN:FieldValue Name="State"/></td>
<td><GEN:FieldValue Name="ZipCode"/></td>
<td><GEN:FieldValue Name="Country"/></td>
<td><GEN:FieldValue Name="PhoneNumber"/></td>
</tr>
</GEN:ItemTemplate>
</table>
</GEN:Table>
</body>
</HTML>
The Table code generation tag generates a Presentation Layer control tag in the ASPX or ASCX file. This Presentation Layer control tag may contain additional Presentation Layer control tags to display the field values from a row in the database table.
To specify the physical layout of a table, the content of the Table code generation tag may contain several template code generation tags. Iron Speed Designer supports five template tags that can be included within the Table code generation tag:
HeaderTemplate – describes the table’s column headings.
FooterTemplate – describes the table’s column footings.
ItemTemplate – describes the layout of a row in the table.
AlternatingItemTemplate – describes the layout of an alternating row in the table, a mechanism for implementing “green bars”.
SeparatorTemplate – describes row separators in the table.
The ItemTemplate, AlternatingItemTemplate and SeparatorTemplate code generation tags are special tags that allow you to specify a section of layout that may be repeated by an application as needed.
The ItemTemplate code generation tag specifies the repeating record for each row of a table. The contents within the ItemTemplate tag can contain other code generation tags including FieldValue to display the value of a database field. It is not necessary that each record is displayed as a row in table. The records can be displayed in any configuration such as three records to a physical row in a table.
The Table tag may optionally contain the AlternatingItemTemplate tag to specify an alternating row within a table and a SeparatorTemplate tag to specify the separator after each row. The HeaderTemplate and FooterTemplate tags can also be used to specify the header and footer of the table. These tags are defined later in this section. If the optional tags are used, their ordering within the Table code generation tag is not important. For understandability, the recommended order is HeaderTemplate, ItemTemplate, AlternatingItemTemplate, SeparatorTemplate and FooterTemplate. There should be no HTML code present between any of the template code generation tags.
There should be no HTML code present between any of the template code generation tags.
|
|
|
A simple table with an ItemTemplate tag specifying the row layout and no other specification tags. |
|
|
|
A more complex table employing a HeaderTemplate tag, ItemTemplate tag, and a SeparatorTemplate tag. The HeaderTemplate tag specifies the column headings; the ItemTemplate tag specifies the layout of the individual rows; and the SeparatorTemplate specifies the horizontal line separating each row. |
The Table and Template code generation tags generate a Repeater control to create the repeating elements. You may want to review the .NET documentation for an in-depth understanding of how the Repeater controls work.
Iron Speed Designer does not differentiate between display-only and editable tables. Individual fields within the table may be display-only or editable. To make an editable table, set the individual fields within the table to be editable by selecting the Text Box style in the tag’s Properties dialog. You can also set some fields to be editable, while other fields are display-only.
Nested Table tags can be used to display tables within tables when a foreign key relationship exists between two database tables. Nested Table tags are used for one-to-many relationships where the inner Table tag is bound to the "child" table of a foreign key relationship, while the outer tag (an individual Record tag or an ItemTemplate tag inside of a Table tag) is bound to the "parent" table of the foreign key relationship. This is because the outer record's primary key value (rather than a foreign key value) will affect the inner record(s) selected and displayed.
The following example shows an outer Table tag that presents a list of job applications. The inner Table tag shows the employment history of each applicant in the outer job application table.
<GEN:TABLE NAME="Table">
<GEN:ITEMTEMPLATE NAME="ApplicationsRecordRow">
<table class="dialog_view" cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="dialog_body">
<table cellpadding="0" cellspacing="3" border="0">
<tr>
<td width="120">
<table cellpadding="10" cellspacing="0" width="120" style="border: solid 1px #000000;" bgcolor="#ffffff">
<tr>
<td><img src='<GEN:FIELDVALUE NAME="ImageFV" TYPE="TextBox"></GEN:FIELDVALUE>'></td>
</tr>
</table>
</td>
<table cellpadding="0" cellspacing="0" border="0" width="200">
<tr>
<td>
<h1><GEN:FIELDVALUE NAME="FirstNameFV" TYPE="TextBox"/> <GEN:FIELDVALUE NAME="LastNameFV" TYPE="TextBox"/><br></h1>
<GEN:FIELDVALUE NAME="AddressFV" TYPE="TextBox"></GEN:FIELDVALUE><br>
<GEN:FIELDVALUE NAME="CityFV" TYPE="TextBox"></GEN:FIELDVALUE>, <GEN:FIELDVALUE NAME="StateFV" TYPE="TextBox"></GEN:FIELDVALUE> <GEN:FIELDVALUE NAME="ZIPFV" TYPE="TextBox"></GEN:FIELDVALUE><br>
<br>
<GEN:FIELDVALUE NAME="HomePhoneFV" TYPE="TextBox"></GEN:FIELDVALUE> home<br>
<GEN:FIELDVALUE NAME="WorkPhoneFV" TYPE="TextBox"></GEN:FIELDVALUE> work<br>
<br>
<a href='mailto:<GEN:FIELDVALUE NAME="EmailAddressFV" TYPE="TextBox"></GEN:FIELDVALUE>'><GEN:FIELDVALUE NAME="EmailAddress2FV" TYPE="TextBox"></GEN:FIELDVALUE></a><br>
<br>
Available to start on <GEN:FIELDVALUE NAME="AvaliableToStartFV" TYPE="TextBox"></GEN:FIELDVALUE><br>
<br>
<b><GEN:FIELDVALUE NAME="JobOpeningIDFV" TYPE="TextBox"></GEN:FIELDVALUE></b>
</td>
</tr>
</table>
</td>
EMPLOYMENT HISTORY<br>
<table cellpadding="0" cellspacing="0" border="0" background="0" width="100%" height="80" bgcolor="#ffffff">
<tr>
<td>
<div style="left:0; top:0;width:100%;height:80;border:1px solid black;overflow:auto;" bgcolor="white">
<%= Me.SystemUtils.GenerateEnterKeyCaptureBeginTag(Me.FindControl("ForEachButtonBar1Button")) %>
<table bgcolor="#FFFFFF" cellpadding="0" cellspacing="0" border="0" width="100%">
<GEN:TABLE NAME="EmploymentHistoryTable">
<GEN:ITEMTEMPLATE NAME="EmploymentHistoryRecordRow">
<tr>
<td colspan="4"> </td>
</tr>
<tr>
<td width="5"> </td>
<td align="left" valign="top" width="50%" class="OneToManyBox">
<b><i><GEN:FIELDVALUE NAME="JobTitleFV"></GEN:FIELDVALUE></i></b><br>
<nobr><GEN:FIELDVALUE NAME="DateStartedFV"></GEN:FIELDVALUE> to <GEN:FIELDVALUE NAME="DateLeftFV"></GEN:FIELDVALUE></nobr>
</td>
<td align="left" valign="top" width="50%" class="OneToManyBox">
<b><GEN:FIELDVALUE NAME="EmployerNameFV"></GEN:FIELDVALUE></b><br>
<GEN:FIELDVALUE NAME="EmployerLocationFV"></GEN:FIELDVALUE><br>
</td>
<td width="5"> </td>
</tr>
<tr>
<td colspan="4" style="border-bottom: solid 1px #cccccc"> </td>
</tr>
</GEN:ITEMTEMPLATE>
</GEN:TABLE>
</table>
</div>
</td>
</tr>
</table><br>
</tr>
</table>
</td>
</tr>
</table>
</GEN:ITEMTEMPLATE>
</GEN:TABLE>
Table Pass-Through Attribute Properties