Chapter 9. Displaying All Records in Edit Mode

If you have used earlier versions of AspGrid, you are probably familiar with the BuildForm method of the Grid object that enables you to build data-bound forms. In AspGrid 3.0, this method in conjunction with the technique described in the previous chapter enables you to display all records in your grid in the edit mode. This special mode enables you to modify a record in one step, thereby cutting the number of form submissions by half.

This technique is demonstrated by the code sample http://localhost/aspgrid/09_editmode/editmode.asp. The ASP code contained in this sample is virtually identical to that of the previous chapter, except that a call to Grid.Display( False ) is replaced by

The BuildForm method is very similar to Display( False ) in the sense that it does not send HTML code directly to the browser and populates the Grid.Output collection instead. The only difference is that BuildForm forces every record in the grid to be displayed in the edit mode.

Note that there is no need for edit or cancel buttons anymore. Each record is now equipped with the Save and Delete buttons. Note also that this mode does not allow you to make changes in several records and save them at once. Records must still be edited and saved one at a time. The only advantage is that you don't have to click on the edit button before you can start editing a record.

The client-side JavaScript validation technique described in Chapter 6 can no longer be used in this mode because we now have multiple edit forms on a page - one for each record. Moreover, when we click on an "Add New" button we will have all those forms plus one more for adding a record.

To be able to differentiate between the multiple forms, AspGrid generates unique NAME attributes for each <FORM>. The edit forms are named as follows: AspGridFormEdit1_xxx, where xxx is the identity column's value for the respective record. The "Add New" form, if present, has the name AspGridFormSave1.

Now that every form has a unique name, a form must somehow pass its identity to the validation procedure upon form submission. This is achieved as with the help of a place holder ???:

AspGrid will automatically replace the ??? with the respective identity column value, so that the <FORM> tags will look similar to this:

The Add New form will use 0 for the identity value, as follows:

The Validate routine must be changed accordingly to take into account the identity argument:

As far as the deletion confirmation dialog box is concerned, nothing new needs to be done there. Just set the property Grid.DeleteButtonOnClick to a verbal message you want this dialog to display:

Starting with Version 3.1, AspGrid enables a user to modify and update multiple records at once. To enable this mode, you must pass False to the method BuildForm as follows:

The rows will no longer have Save and Delete buttons on the sides. Instead, a single Update button will be displayed in the footer of the grid, and a checkbox will be provided for each row to mark it for deletion, as follows:

A user can make changes to one or more rows, and mark other rows for deletion by checking off the appropriate checkboxes. All changes are saved by clicking the Update button. The changes are also saved when the navigation buttons are clicked when present.

The usage of Grid.BuildForm( False ) is demonstrated by the code sample http://localhost/aspgrid/09_editmode/update_all.asp. The Update-All-At-Once technique requires a more complicated client-side JavaScript validation code that the techniques we have seen before. The ASP code that follows a call to BuildForm(False) is also slightly different than that used with BuildForm().

Here are some highlights of the sample file update_all.asp:

Notice that we do not use the ??? signs in the validation routine because only one form will be generated. Also notice that this mode of operation involves submitting large amounts of data, and therefore the POST method should be used.

Notice that multiple calls to Response.Write Row.Form and Response.Write FRow.Form are replaced by a single call to Response.Write Grid.Output.Form since both the entire body and footer areas are now part of a single <FORM>. Other than that, this code is identical to the sample file editmode.asp.

Client-side JavaScript validation is code is slightly more complicated because we need to loop through multiple rows when the Update button is pressed. We also need to provide a separate validation piece for the Save button used in the Add New form. Here is the abridged version of the validation routine:

The validation routine, when present, is invoked by both the Update and navigation buttons.