|How to check input fields before sending them to the server using Dynamic HTML Editor 5.5+|
|Dynamic HTML Editor 5.5+ permits you to specify one or more validation rules for input fields in a form object. The validation is done on the "onSubmit" event of the Form, just before sending data to the server.|
You can choose from many methods to alert the user that a validation error occurred (from a messagebox or a more complex custom function).
Now we'll create a simple Contact Form with three input fields, all required; we'll insert Name, Email and Message. We need also one Submit button that will automatically send the data to the server when pressed.
The field "Name" has been named "txtName" and is a normal TextBox;
The field "Email" has been named "txtEmail" and is a normal TextBox;
The field "Message" has been named "txtMessage" and is a TextArea.
The field "Send Email!" has to be of type "Submit"!
I added also a "Style" class to the input controls to enhance their appearance.
In the editor the form will appears like this:
|Double click over an empty point of the Form object (or press the "Other" button on the properties panel) and a window like this will appear|
|Click on the "Validation" tab and press the "Add" button to add rules; in the next picture you can see that I added the validation rule for the email field.|
|After having added all validation rules choose the method used to display the error to the user of your page:|
- a messagebox will display an alert box
- a confirm box will ask the user to confirm data before sending it to the server
For simplicity I put the callback function into an HTML element at the bottom of this page (check the source .dhe file for the complete sample).
Try to press the "Send Email!" button without writing anything into fields ;-)