search

AlexNexton / BI-Team-5

Cafe Java is a local coffee shop which is unable to operate smoothly due to the Global Pandemic (Covid). The cofee shop was only able to accept walk in customers, which under current safety regulations are seen as not safe and more importantly it has seen an increase in revenu loses. As a team, we have build a website to enable Cafe Java customers to make their orders online in advance of their visit to the shop with the aim to save the business from collapsing.
https://alexnexton.github.io/BI-Team-5/
0 stars 3 forks source link

BOOK & ORDER SECTION: Booking and Order modals email input allow non-email text to be entered #36

Closed simonjvardy closed 4 years ago

simonjvardy commented 4 years ago

Describe the bug When entering user details for either the Booking or Order form modals, the email input allow non-email text to be entered without giving a warning.

To Reproduce Steps to reproduce the behavior:

  1. Open a web browser
  2. Go to https://alexnexton.github.io/BI-Team-5/
  3. Scroll down to the Book & Order section
  4. Click on either "Book a table Button" or "Order to go" buttons
  5. complete all the fields
  6. When entering an email address, the email address format is not enforced and any text will be accepted.

Expected behavior An error message should be displayed and the email field highlighted and the user is not allowed to progress further until the email address format is entered correctly.

Screenshots image

Desktop (please complete the following information):

Additional context

simonjvardy commented 4 years ago

Updated the email input fields setting the type attribute to type="email"

Book a table form

<!-- 1.1.2 email address input----->
<div class="form-group mb-0">
  <label for="email1"></label>
  <input type="email" class="form-control text-center" id="email1" placeholder="Email address" required />
</div>

Order to go form

<!-- 1.1.2 email address input----->
<div class="form-group mb-0">
  <label for="email2"></label>
  <input type="email" class="form-control text-center" id="email2" placeholder="Email address" required />
</div>