CodeCharge StudioA grid form is used to display multiple rows of records within an HTML table. A grid should be used when there is a need to display records but not edit the records. A grid does not have inbuilt functionality to insert, update or delete database records. If you need to perform any of these operations, you should consider using a record form or an editable grid. Typically, grid forms contain Link fields to corresponding record forms where a specified record can be edited.
Apart from displaying multiple records, a grid facilitates such operations as sorting the records based on different columns in the grid or browsing multiple pages when the records to be displayed span more than one page.
Grid forms can be constructed using the Grid builders or you can manually construct one using the barebones grid form provided under the Forms tab of the Toolbox. Unless you need to exercise full control over the creation of the grid, it is recommended that you use the Grid builders.
In terms of HTML markup, a grid form is made up mainly of an HTML table with different controls in its rows.
In design mode, a grid form appears between the glyphs 
and 
. You can click on either of these glyphs to expose the grid properties under the Data tab of the Properties window. Alternatively, you can click on the name of the grid in the Project Explorer.
| Property | Description |
|---|---|
| Name | A unique name for the form. |
| Connection | The database connection used by the form. |
| Source Type | The type of database resource that provides the data for the form. |
| Data Source | The table, SQL query or stored procedure that provides the data for the form. |
| Restricted | Specify whether users must be authenticated before being able to view the form. |
| Records Per Page | A grid can display multiple records in a page. Use this property to set the number of records to be displayed on a page. |
| Page Size Limit | In certain cases where the number of records per page can be changed dynamically at runtime, this property can be used to set the maximum number of records that could possibly be displayed per page. |
Similar to all other forms, the Data Source property of a grid is used to specify the database resource that will provide the data for the grid. This can be a table, a SQL query or a stored procedure. To access the Data Source dialog, click on the 
button next to the Data Source property.
The Data Source dialog is also where you can specify input parameters. Input parameters are necessary when the grid form receives values from another form such as a search form and uses the input parameters to filter the records it displays. The search form submits the values then the grid form captures them and uses then in the where clause of the SQL statement that retrieves the database records. To add an input parameter click on the 
button under the Where section.
A grid form typically has sorter controls for each column in the grid. Sorters controls are used to facilitate sorting of the records within the grid based on the columns of the grids. For instance, if a grid has name, email and title columns, sorters could be used to sort the grid records based on any one of the three columns. Sorter controls are usually located in the top-most row of the grid as shown below:
When you build a grid form using the Grid builders, you can elect to have the sorter controls automatically added to the form so that you don't have to add them later on. If you build the form manually, you can also add sorter controls using the Sorter option under the Forms tab of the Toolbox. For more information on how to add and configure sorter controls, please refer to the section on building forms manually.
The controls which display data in a grid are usually contained in the second row of the grid. Unless under special circumstances, the data controls in a grid are usually Label controls which can display data but don't allow the user to alter or submit the data.
During runtime, the data row in the grid is outputted for each record that needs to be shown. If the grid has 10 rows to be shown, the data row will be printed out 10 times, each time with different data being shown in the data controls.
If you create a grid form using the Grid builders, you can elect to have an alternate data row. You would therefore end up with two data rows, whereby one row would have a different background color to emphasize the separation between consecutive rows.
The row which appears under the data row contains some text which is displayed whenever there is no data to be shown for the grid. This row is displayed conditionally, meaning that it is not shown when there is at least one row of data in the grid. You can change the text within this row as you wish.
The last row in a grid is usually reserved for the Navigator control. In a grid with records which span multiple pages, the navigator provides a way to browse through all the available pages.
When you build a grid form using the Grid builders, you can elect to have the navigator control automatically added to the form so that you don't have to add it later on. You can also select different options for the navigator such as image use, the number and format of page links, etc. If you build the form manually, you can also add a navigator using the Navigator option under the Forms tab of the Toolbox. For more information on how to add and configure a navigator, please refer to the section on building forms manually.