Table with Search

This example creates a search control to search within a table.

Description

Generated Page

Layout Page File

 

     <div align="center">

          <GEN:SearchFilter Name="SearchTextBox" />&nbsp;&nbsp;

          <GEN:PushButton Name="Search" />

          <GEN:Table Name="Products">

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

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

              <GEN:ItemTemplate>

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

                   <td>

                        <GEN:FieldValue Name="ProductId" />

                   </td>

                   <td>

                        <GEN:FieldValue Name="ProductName" />

                   </td>

                   <td>

                        <GEN:FieldValue Name="UnitPrice" />

                   </td>

                   <td>

                        <GEN:FieldValue Name="UnitsInStock" />

                   </td>

                   <td>

                        <GEN:FieldValue Name="Discontinued" />

                   </td>

              </tr>

              </GEN:ItemTemplate>

          </table>

          </GEN:Table>

     </div>

Procedure

Several hookups are required for the search control to work correctly:

Step 1:  Hook up the search button and search text box to inform the table when the button is clicked.  In the Page Properties dialog, select the search button, go to the Bindings tab and select SearchTextBox as the control to hook up.

Step 2:  Build and run the application.