#90 : ENHANCEMENT: Show Newsletter Subscription Confirmation message solved

[Anwishta]

Description:

This pull request solves issue #90. It adds email validation to the newsletter subscription form, ensuring that the user enters a valid email address before showing the subscription confirmation modal. If the email address is invalid, an error message is displayed, and the subscription modal does not appear.

Changes Included:

Email Validation Logic:

A regular expression is used to validate the email format before submission. If the email is invalid, the user is prompted with a clear error message asking them to input a valid email address.

Modal Visibility Control:

The subscription modal will only be shown if the user inputs a valid email. This enhances the user experience by preventing invalid form submissions and unnecessary modal popups.

Form Handling:

Added onSubmit to the form to handle the submission properly, preventing default behavior until email validation is successful.

Error Message Display:

If the email is not valid, an error message is dynamically displayed under the input field. Error message disappears once a new valid email is entered.

Screen Record :

https://github.com/user-attachments/assets/ff002c4b-7eb5-48a0-ab8d-f9b811c8e717

Testing:

Tested the form with both valid and invalid email formats. Ensured that the modal appears only when the email is valid. Verified that error messages are displayed correctly for invalid input.

[netlify[bot]]

✅ Deploy Preview for library-man ready!

Name	Link
🔨 Latest commit	6c516501b2e5c72ba78397876164dedde01f8c79
🔍 Latest deploy log	https://app.netlify.com/sites/library-man/deploys/67013839391e1900087752c7
😎 Deploy Preview	https://deploy-preview-95--library-man.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[ajaynegi45]

Description:

This pull request solves issue #90. It adds email validation to the newsletter subscription form, ensuring that the user enters a valid email address before showing the subscription confirmation modal. If the email address is invalid, an error message is displayed, and the subscription modal does not appear.

Changes Included:

Email Validation Logic:

A regular expression is used to validate the email format before submission. If the email is invalid, the user is prompted with a clear error message asking them to input a valid email address.

Modal Visibility Control:

The subscription modal will only be shown if the user inputs a valid email. This enhances the user experience by preventing invalid form submissions and unnecessary modal popups.

Form Handling:

Added onSubmit to the form to handle the submission properly, preventing default behavior until email validation is successful.

Error Message Display:

If the email is not valid, an error message is dynamically displayed under the input field. Error message disappears once a new valid email is entered.

Screen Record :

Screen.Recording.2024-10-05.182333.mp4

Testing:

Tested the form with both valid and invalid email formats. Ensured that the modal appears only when the email is valid. Verified that error messages are displayed correctly for invalid input.

I think the error message you shown is default html validation message not your. Make the required changes and make new pr