Displaying Dropdown List Fields

This example displays a field as a drop down list instead of text.  An HTML layout page is created with one FieldValue code generation tag for each database field to be displayed.  This example illustrates:

1. How different FieldValue tags can display data in different formats.

2. How a drop down list can be displayed for a Boolean field.

Description

Generated Page

Layout Page File

Note: The layout page file for displaying a value as a literal, checkbox, radio button or drop down list is exactly the same.  Set the display type property in the Page Properties dialog.

 

     <div align="center">

          <GEN:Record Name="Product">

          <table cellpadding="5" style="border-collapse: collapse" border="1"

                        bordercolorlight="#C0C0C0" bordercolordark="#C0C0C0">

              <tr style="font-family:Verdana; font-size:10px">

                   <td align="right">Product Id:</td>

              <td style="font-weight: bold">

                   <GEN:FieldValue Name="ProductId" />

              </td>

          </tr>

          <tr style="font-family:Verdana; font-size:10px">

              <td align="right">Product Name:</td>

              <td style="font-weight: bold">

                   <GEN:FieldValue Name="ProductName" />

              </td>

          </tr>

          <tr style="font-family:Verdana; font-size:10px">

              <td align="right">Unit Price:</td>

              <td style="font-weight: bold">

                   <GEN:FieldValue Name="UnitPrice" />

              </td>

          </tr>

          <tr style="font-family:Verdana; font-size:10px">

              <td align="right">Units in Stock:</td>

              <td style="font-weight: bold">

                   <GEN:FieldValue Name="UnitsInStock" />

              </td>

          </tr>

          <tr style="font-family:Verdana; font-size:10px">

              <td align="right">Discontinued:</td>

              <td style="font-weight: bold">

                   <GEN:FieldValue Name="Discontinued" />

              </td>

          </tr>

     </table>

     </GEN:Record>

</div>

Procedure

Step 1:  Set the Display Style property to Dropdown List.  If the “Create from database field” checkbox is selected, Boolean data types will display three choices for True, False and Null (Please select) value.  To specify only two values, select the Specify Items option and enter Yes and No as the two values.  The order of the values does not matter.

For the individual FieldValue tags, select each of the ProductID, ProductName, UnitPrice and UnitsInStock and select the appropriate database field from the Products table to display.  If the name of the code generation tag is the same as the field name of the enclosing record, the Page Properties dialog automatically selects the field as a convenience.  The automatic selection occurs when you select each of the code generation tags.

Step 2:  Build the application.

Step 3:  Open a new browser and enter this URL to display the page:

http://localhost/Tutorial/Tutorial%20Pages/DisplayDropdown.aspx?Product=5

Product is the query string parameter and the value 5 is the primary key value of the specific Product record to be selected and displayed.