I received an assignment from a website and I put in my best effort to fulfill all the specified requirements. However, I am struggling to identify where my code is going wrong. Can anyone help me with this issue?
-
Your form should resemble the form in the provided Bookform image link, including all the listed constructs. Make sure to use appropriate HTML5 tags while creating your form to meet all the specifications.
Ensure that autocomplete is active on your form.
You are required to create two field sets - Customer Info and Books, based on the structure shown in Figure 1. For now, focus on setting up the field sets without worrying about the content fields.
- The Name field must have autofocus, placeholder text, and be mandatory. Select the correct type for this field and subsequent fields as well.
- The Telephone field should include placeholder text, pattern restrictions, and be required. The pattern format should follow [Pattern: 1-234-567-8910]
- The Email address field needs Placeholder text and should allow multiple entries. This field is also a required field.
- The Books field should incorporate a data list. You can choose the content you wish to display in this list.
- The Quantity field (Maximum 5) needs a minimum value of 1 and a maximum value of 5.
<html>
<head>
<title>bookform</title>
</head>
<body>
<form autocomplete="on">
<strong> <div style='color:darkblue'> A Simple Form </div> </strong>
<br/>
<i> <div style='color:Lightblue'> Form Fundamentals </div> </i>
<fieldset>
<legend>Customer Info:</legend>
<label for="Name">Name:</label> <input type="text" name="Name" id="Name" placeholder="Enter Your Name" autofocus required/><br/><br/>
<label for="Telephone">Telephone:</label> <input type="text" id="Telephone" name="Telephone" placeholder="Pattern: 1-234-567-8910" pattern="[0-9]{1}-[0-9]{3}-[0-9]{3}-[0-9]{4}" required/><br/>
<br/><label for="Emailaddress">Email address:</label> <input type="text" name="Emailaddress" id="Emailaddress" placeholder="Enter Your Email address" multiple required/>
</fieldset>
<fieldset>
<legend> Books</legend>
<input type="text" name="Books" list="countries"> <datalist id="countries">
</datalist>
<label for="Quantity"> Quantity </label> (Maximum 5): <input type="number" name="Quantity" id="Quantity" max="5" min="1"> <br>
</fieldset>
<br>
<input type="submit" name="submit" value="Submit">
</form>
</body>
</html>ERROR:testWeb(htmlpackage.WebTestBookform): Please check specifications for each tag false
- image
update: I encountered an error when using email as the email type, so I had to avoid using it.