Adding List Boxes and Radio Groups to an HTML Table

By Mark Derwin

Most Maintain applications are designed to include and update data. Typically the user wants to update multiple rows of data at once.

To accomplish this, you have to use a grid. You then need to validate the data for content and format before adding it to the database. What if you wanted to do a survey and just have the user select values from a list? You would not have to worry about validation. You would not have to worry about the user changing other fields in the data. You can control the entries.

List boxes and radio groups can easily be added to an HTML table. You can control what the user can select. When the user makes a selection from either of these objects, the form does not refresh. When Submit is pressed, we retrieve these values into a stack and save them to the database (see Screen 1).

The list box and radio groups are created with HTML tags as columns in a stack. That column is then displayed in the HTML table. When you create the column you must use a very long length. When you display it, you can change its display width. After you add the field to the HTML table, double-click it to display the table column properties (Screen 2). Go to the "Content type" combo box and change the content to 1 - HTML. Here is where you can also change the column's display width. In this example, I am creating three lines. Your values for fld1 can come from the database or another stack. The value of each item in the list box and radio group has two components. The first value is what is retrieved and the second value is what is displayed. In the creation of the list box I am keeping a blank row at the top (see Figure 1).

After the user makes selections we have to use the GetHTMLField to retrieve the values for each row of the HTML table. Each radio group and list box has a unique name. This is why we concatenate the value I to each row. Field Sel contains the value from the radio group and Sel2 the value from the list box. You could also assign them to database fields.

If you want to have the form come up with an item already selected in the radio group, use the following syntax:

" value='POOR' CHECKED>POOR<input 
type=radio name=radio " || i ||

Add the word CHECKED after the value you want pre-selected.

Once you have created the HTML tags for each row, do not resort the stack. The unique names created for the objects do not resort and retrieving the values becomes difficult.

In this example, the lists are static and the same for each row of the stack. You could substitute the values for variables from a stack.

I will address this in my next article.