THIS IS A TEST INSTANCE. ALL YOUR CHANGES WILL BE LOST!!!!
...
Form Event (in order) | Phase | When emitted (and typical use) | Method Name | @OnEvent Constant |
|---|---|---|---|---|
prepareForRender | Render | Before rendering the form (e.g. load an entity from a database to be edited) | onPrepareForRender() | EventConstants.PREPARE_FOR_RENDER |
prepare | Render | Before rendering the form, but after prepareForRender | onPrepare() | EventConstants.PREPARE |
prepareForSubmit | Submit | Before the submitted form is processed | onPrepareForSubmit() | EventConstants.PREPARE_FOR_SUBMIT |
prepare | Submit | Before the submitted form is processed, but after prepareForSubmit | onPrepare() | EventConstants.PREPARE |
validate | Submit | After fields have been populated from submitted values and validated (e.g. perform cross-field validation) | onValidate | EventConstants.VALIDATE |
validateForm | Submit | same as validate (deprecated – do not use) | onValidateForm | |
failure | Submit | After one or more validation errors have occurred | onFailure() | EventConstants.FAILURE |
success | Submit | When validation has completed without any errors (e.g. save changes to the database) | onSuccess() | EventConstants.SUCCESS |
submit | Submit | After all validation (success or failure) has finished | onSubmit() | EventConstants.SUBMIT |
| canceled | Submit | Whenever a Submit or LinkSubmit component containing mode="cancel" or mode="unconditional" is clicked | onCanceled() | EventConstants.CANCELED |
Note that the "prepare" event is emitted during both form rendering and form submission.
...
| Code Block | ||||
|---|---|---|---|---|
| ||||
<div class="form-group"> <label for="userName" class="control-label">User Name</label> <input id="userName" class="form-control" name="userName" type="text"> </div> |
Form Validation
So, this The above example is a basic ( very basic !) form and you can leave the fields blank and submit the form. With very little form which allows the fields to be empty. However, with a little more effort we can add client-side validation , to prevent the user from submitting the form with either field left blankempty.
Validation in Tapestry involves associating one or more validators with a form element component, such as TextField or PasswordField. This can be is done using the validate parameter of the component itself.:
| Code Block | ||
|---|---|---|
| ||
<t:textfield t:id="userName" validate="required" t:mixins="formgroup"/>
<t:passwordfield t:id="password" value="password" validate="required" t:mixins="formgroup"/> |
Available Validators
Tapestry provides the following built-in validators:
...
The @Validate annotation can take the place of the validate parameter of TextField, PasswordField, TextArea and other components. When the validate parameter is not bound in the template file, the component will check for the @Validate annotation and use its value as the validation definition.
The annotation may be placed on the getter or setter method, or on the field itself.
Update Let's update the two fields of the Login page:
| Code Block | ||
|---|---|---|
| ||
@Persist
@Property
@Validate("required")
private String userName;
@Property
@Validate("required")
private String password; |
Now, we'll rebuild the app, refresh the browser, and just hit enter:
...