Data Entering Form Using Form Wizard in Drteamweaver

This video tutorial teaches web app developers how to create a data entering form using Dreamweaver form wizard.

Insert Record Form Wizard

The basic building blocks of an insert page can be added in a single operation using the Insert Record Form Wizard. The wizard adds an HTML form and a Insert Transaction server behavior to your page. The form objects are laid out in a basic table, which you can customize by using the Dreamweaver page design tools (make sure all the form objects remain within the form’s boundaries). To edit the server behavior, display the Server Behaviors list (Window -> Server Behaviors) and double-click on the Insert Transaction server behavior.
You can also add the building blocks separately by using the form tools and the Server Behaviors tab of the Application panel. For more information on building an insert page in multiple steps, see Insert Record Transaction.
The Insert Record Form Wizard is accessible from two locations:

• The MX Kollection tab of the Insert bar.
• The Application panel, Server Behaviors -> + -> MX Kollection -> Forms -> Insert Record Form Wizard.

The purpose of this wizard is to build a page that enables users to insert new records in a database table. This wizard is divided into two compulsory steps, based on the type of data the user has to input. If MX Form Validation has been installed, an additional step will need to be completed. This new step consists of defining the validation rules for all fields included in the generated form.
To build the insert page with the Insert Record Form Wizard, follow the next instructions:

1. Open the page in Design view, and then apply the Insert Record Form Wizard. A dialog box appears.
2. Complete the dialog box, following the instructions below for each of the three steps:
   · Table and redirect information
   · Field information
   · Form validation rules (if the MX Form Validation components have been installed)
3. Click Finish when done.

Table and redirect information

The first step into completing the dialog box requires the user to input basic information about the transaction, like the table in which new records will be inserted and the page to which it will be redirected:

To set the dialog box options, follow the next steps:

1. In the Connection drop-down menu select the database connection defined for your site; if you don't have a connection yet, you can use the Define button and create one now.
2. In the Insert into table drop-down menu, select the database table where you want to insert records;
3. In the Primary key column drop-down menu specify the primary key column for the current table. The content of this drop-down menu is refreshed each time the user changes the table for the insert operation. By default, the first element is selected.
4. The Numeric checkbox specifies whether the selected Primary key column has a numeric type (integer, double, etc). The state for this checkbox is altered each time the user changes the selected value of the Primary key column according to the meta-data retrieved by Dreamweaver for the specified table column.
5. In the After inserting, go to text box enter the page to be opened after the record is inserted into the table, click the Browse button to select the file page or use the InterAKT Dynamic Data (the lighting bolt icon) to build the file name.
6. The five buttons in the lower part of the interface offer the following functionalities:
   · With the < Back / Next > buttons you can navigate through the wizard's steps.
   · Click Finish when you are done configuring the wizard.
   · Click Cancel to exit without the new settings to be applied.
   · The Help button brings you to this help page.
   These buttons appear on all three interfaces of the Insert Record Form Wizard.
7. Click Next to continue with configuring the wizard.

Fields information

This dialog box allows you to define exactly which fields get which data and where they get it from. This is where you will determine how an input for a specific field will be displayed as:

To set the dialog box options, follow the next steps:

1. In the Form fields area specify the form objects you want to include on the HTML form of the insert page, and which columns in your database table each form object should update.
   By default, ImpAKT3 creates a form object for each column in the database table. If your database automatically generates primary key ID's for each new record created, remove the form object corresponding to the primary key column by selecting it in the list and clicking the Minus (-) button. This eliminates the risk of the user entering an ID value that already exists.
   Use the Plus (+) button to add form fields to the current transaction.
   You can also change the order of the form objects on the HTML form by selecting a form object in the list and clicking the up and down arrows on the right top side of the dialog box.
2. Specify how each data-entry field should be displayed in the HTML form by selecting a row (single click) in the Form fields area and entering information in the boxes below the grid as indicated below.
3. In the Label text box enter a descriptive label to display beside the data-entry field. By default, the column’s 'generic name' is displayed (MX Kollection 3 removes the part in the column name that starts with "_" and capitalizes the first part).
4. In the Display as drop-down menu select a form object to serve as the data-entry field. You can select from the following list: Text field, Text area, Menu, Hidden field, Checkbox, Radio group, Password field, Text, File field. Depending on your selection, the interface changes:
   
   1. Text field - if you select this option, the following interface fields will be displayed:
   · In the Submit as drop-down menu select the data format accepted by your database table. For example, if the table column only accepts numeric data, select Numeric. The available options are: Text, Numeric, Double, Date.
   
   Note: If you are using a Microsoft Access database, in the Submit as drop-down menu, another option will be available: Date MS Access. Select this option when submitting date fields.
   
   · In the Default value text box specify the default value for the selected table column. You can use the InterAKT Dynamic Data (the lighting bolt icon) to build the default value.
   
   2. Text area - if you select this option, the interface displayed is similar to the one corresponding to the Text field option.
   
   3. Menu - if you select this option, the following interface fields will be displayed:
   · In the Submit as drop-down menu select the data format accepted by your database table. The available options are: Text, Numeric, Double, Date.
   · If the case, use the Add Recordset button to create a recordset from which the menu should retrieve data later on:

4. · Click on the Menu Properties button to populate the menu items. You can this dynamically, by using a recordset, or statically (manually):
   
   
   
   4. Hidden field - if you select this option, the interface displayed is similar to the one corresponding to the Text field option. There is a difference though, namely the fact that the Label text box is now disabled, given the fact that the field is hidden.
   Note: Hidden fields are inserted at the end of the form.
   
   5. Checkbox - if you select this option, the following interface fields will be displayed:
   · In the Submit as drop-down menu select the available option that fits your needs the best: Checkbox: Y,N; Checkbox: 1,0; Checkbox:-1,0.
   · In the Initial State radio group select whether or not you want the control to be checked by default or not.
   
   6. Radio group - if you select this option, the following interface fields will be displayed:
   · In the Submit as drop-down menu select the data format accepted by your database table. The available options are: Text, Numeric, Double, Date.
   · By clicking the Radio Group Properties button you can set all the available options that you need for you radio group:
   
   
   
   7. Password field - if you select this option, the interface displayed is similar to the one corresponding to the Text field option.
   
   8. Text - if you select this option, the interface displayed is similar to the one corresponding to the Text field option.
   Note: For read-only entries, select Text.
   
   9. File field - if you select this option, the following interface fields will be displayed:
   · In the Submit as drop-down menu there is only one available option: File.
5. You can use the Back button to alter the table and redirect information. If you do not wish to validate the user input, you can click on Finish to add the Insert Record elements to the page. If you want to go to the third and last step of the wizard, click Next.

Form validation rules

This last step of the wizard configures the validation rules for each of the form input fields. You can define a rule for each form element, so that bad input will be avoided:



For instructions on completing this step, see Form Validation in wizards.
Remember that this step appears only if you have the whole MX Kollection 3 package installed, or even only MX Form Validation. In this case, a MX Form Validation trigger, with a validation role, will be added to your page.