Skip to content

[FIX] Add form validation to menu item creation modal#273

Open
Siddh2024 wants to merge 1 commit into
rdodiya:gssoc_developfrom
Siddh2024:fix/267-menu-form-validation
Open

[FIX] Add form validation to menu item creation modal#273
Siddh2024 wants to merge 1 commit into
rdodiya:gssoc_developfrom
Siddh2024:fix/267-menu-form-validation

Conversation

@Siddh2024

Copy link
Copy Markdown
Contributor

Description

Fixes #267

Added comprehensive client-side form validation to the menu item creation modal to prevent empty or invalid submissions.

Changes Made

  • Added errors state to track per-field validation errors with visual feedback
  • Added validateForm() with checks for name, price, category, description, and image URL
  • Added image file validation (PNG/JPG/WEBP/GIF, 5MB max)
  • Added visual error indicators with aria-invalid and error text below fields
  • Added submitError alert banner and toast notifications
  • Added description character counter (n/500)
  • Validation blocks submission when any field is invalid; errors clear on edit

Testing

  1. Submit empty form - shows errors on name, price, category
  2. Invalid price (0 or negative) - shows price error
  3. Long name/description - shows max length errors
  4. Valid data submits successfully; edit mode also validates

- Added errors state tracking for each form field
- Implemented validateForm() with checks for name (required, min/max length), price (required, > 0, max limit), category (required), description (max length), and image URL format
- Added visual error indicators (red border with aria-invalid, error text below fields)
- Added description character counter (500 max)
- Added image file type and size validation (PNG/JPG/WEBP/GIF, 5MB max)
- Added submitError banner for API-level error feedback
- Validation prevents form submission when any field is invalid
- Errors clear automatically when user starts editing a field
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] Missing form validation on menu item creation

1 participant