Skip to content

Form Validation (Frontend) #105

@tunile943

Description

@tunile943

Branches: FormValidation

Task at Hand

  1. Start: Pull from master branch, then create and enter your new branch FormValidation.

    • From here, navigate to frontend folder, and run yarn run dev. Navigate to the localhost:3000. Try to create a new empty meeting, as you can see, our system recognizes that we don't have enough information to create a meeting, yet no information is outputted for the user. This is counter-intuitive from user standpoint, they would expect some form of error to pop up when create meeting is not successful. Let's fix this!
  2. Add validation for the following atoms. You can find all of these in the '\components\atoms` folder. Refer to one we have done for DatePicker for desired design.

    • TextField: All of the "Meeting title", "Email", and "Description" are required. Let us output an error if the user clicks on the text field and un-clicks it yet the field is still empty.
    • Dropdown: Since we are assuming that our meeting is hybrid by default; then if they click on any of the dropbox and un-click it, and yet the dropdown box is still the default option, output an error.
    • Upload: Same as above.
    • TimePicker: Fix it so that "Time is required" only pops up after the user has clicked and un-clicked the box.
    • If the user opts for Create Meeting yet not all the required field is satisfied, we should output an error as well.
  3. Confirm that your code and pull request follow the Pull Request Checklist. ### Acceptance Criteria

  • Implement validation for TextField
  • Implement validation for Dropdown
  • Implement validation for Upload
  • Fix validation for TimePicker
  • Create Meeting should correctly output an error when the user try to create an unfinished meeting.

Notes

Metadata

Metadata

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions