Text Input Form - Instructions

This form has text input controls.

You can make fields required, which is a validation that is checked on form submission. Any field that is required must have a value provided.

You can also add Validation attributes. These vary per field and are shown in the paragraph below the field.

Some will use pattern regex matching.

Reset & Submit

The two main form controls provided are reset and submit.

Reset will cancel any inputs and reset the form back to its defaults.

Submit will apply validation and send the details to the server.

JavaScript

The form also has JavaScript controls. These can:

  • validate the form prior to submitting it to show any errors on screen
  • trigger the submit process to ‘validate and submit’
  • submit the form regardless of any validation issues.

It is important to realise that it is possible to submit forms, regardless of the validation imposed on them at the front end. Which is why the back-end server should also be validating the input data sent to it.

Testing

Explore the JavaScript functionality for sending forms and ensure you know multiple ways of bypassing the validation of forms to allow you to test back end validation.

Check the validation.

Amend the validation attributes in the DOM and send ‘invalid’ data to the server.

Automating

  • Try to automate all the actions.
  • Automate with required on, and required off.
  • Automate with validation on and off.

You can learn more about Testing Input Elements in our reference section.