Getting Started with Form Toolkit

Step 1: Insert the Captcha

1. With your PHP form open in Dreamweaver, place your cursor where you wish to insert the Captcha graphic and text field.
   
2. From the WebAssist menu, choose Forms > Insert Captcha.
   
3. In the Insert Captcha interface, configure the Captcha graphic you wish to insert to your page.
   The preview below will generate instantly provided that you are working on form that resides on a functioning PHP testing server.
   
   
   
   
4. Once you are satisfied with the appearance of your Captcha graphic, click OK to insert to your page.

Now that your Captcha has been inserted to your page, you will want to add the Server Validations to ensure the code is always entered correctly before allowing the visitor to proceed.

Step 2: Applying Server Validations to your Captcha security

When adding server validations to a form, it is usually a two part process. First, you are applying the validation behavior which checks to see if the form validates or not. Second, you create a Show If Behavior which displays something on the page when the validation fails (or passes).

1. From the WebAssist menu, choose Forms > Validation > Server Validation.
   
2. From the Server Validations interface, choose the appropriate Validation trigger.
   In most cases, Any Form Post will work.
   
3. From the Validation type field, choose Like Entry.
   
   
   
   
4. Click Server variable lightning bolt.
   
5. Expand the Session option and choose the captcha_Security_Code option.
   
   
   
   
6. Click OK.
   
7. Click the Add (+) button below the Server variable field.
   
8. When the Like Entry dialog appears, click the Same as lightning bolt.
   
9. Expand the form that contains your Captcha Security, select the Security_Code text field.
   
   
   
   
10. Click OK.
    
11. In the Failed Redirect field, enter or browse to the file you wish to use if the validation fails.
    If you wish to display an error on the form if the validation fails, you should select the current page.

Now that you have applied the Server Validation, you will want to create the Show if behavior to display an error if validation fails.

Step 3: Creating the Error Message when the Captcha code is entered incorrectly

Using the Validation Show If behavior included with Form Toolkit, you can create an error message for your visitor that will only show when they incorrectly enter the Captcha code.

1. Type the error message you wish to appear when the Captcha code is entered incorrectly on your page.
   In most cases, you will want this error to be directly beside or beneath the Security Code text field.
   
2. Highlight the error message you have typed.
   
3. From the WebAssist menu, choose Forms > Validation > Validation Show If.
   
4. From the Validation page field, select the current page.
   When applying a Show If behavior, you always choose the page that you have added the Server Validation to.
   
5. From the Validations fail menu, choose the Like Entry validation you applied for the Captcha and click the plus (+) button.
   
   
   
   
6. When you are finished click OK.

You have now created an error message that will only display when the Server Validation fails. This can also be used on areas of code instead of text if, for example, you wanted to change the CSS styles when validation fails or passes.

Step 1: Applying the Validation

1. From the WebAssist menu, choose Forms > Validation > Server Validation.
   
2. From the Validation trigger menu, choose the appropriate trigger to initiate the validation.
   The default option of Any Form Post is most commonly used.
   
3. In the Validation type menu, choose the type of validation you wish to apply.
   
4. Select the server variable lightning bolt to choose the server variable, or form field you wish to validate.
   Typically, you would expand your form, and select the particular element you wish to apply validation to.
   
5. Click the Plus (+) icon to specify the validation settings.
   
6. Click OK once you have specified the appropriate settings.
   
7. Continue applying validations to any form fields or server variables that you desire.
   
8. In the Failed redirect, specify a page that you wish to redirect to on fail.
   If you wish to display a validation Show If behavior on the form when an error occurs, you will need to specify that form page.
   
   One of the differences between client validations and server validations is that server validations do not display an error message if validation fails. However, server validations have the power to apply a Validation Show If behavior, which instead displays an error message beside the form field that fails validation. This is a much more attractive way to display errors.
   
   
9. When you are ready and have created all your necessary validations, click OK.
   
10. Click OK when you are ready.
    
11. Continue applying additional validations to any of your form fields. You can apply more than one validation to a single form element.
    
12. Click Finish once you have applied all the validations you like.

More information regarding each specific type of validation, can be found in the Context Sensitive Help documentation which can be found by clicking on any of the Help buttons within the Validation Toolkit interface.

Step 2: Applying the Validation Show If Behavior

The Validation Show If Behavior allows you to specify various regions or elements on your to display if a server validation fails or passes.

Two common uses:

1. Display your error message directly beside the form field that failed validation. This makes it easier for users to fix their mistakes.
   
2. Display an additional region on your page if a check box is selected. For example, if you have a check box that asks if a user is over 18, when selected, a user agreement could display on the page.

1. Create the content or text that you wish to be displayed if the validation passes or fails.
   For error messages, you could simply type your message beside the form field, and style it with a red color.
   
2. Highlight the region or text that you wish to display.
   
3. From the WebAssist menu, choose Forms > Validations > Validation Show If.
   
4. For displaying when validation fails, choose the Validation from the Validation fail menu.
   
5. For displaying when validation passes, choose the Validation from the Validation pass menu.
   
6. Press the Plus (+) icon.
   
7. Click OK when you are ready.

Now that you have created the validation behavior and the show if behavior, you can test your page out to see how the validation works.