In: Computer Science
Coding – You don’t have to submit the full html document only submit what should be in the <body> element. Be sure to name your form controls, classes and/or ids in a meaningful manor.
5. Create a form that submits to ‘myScript.php’ with a drop down (or select) list that has 3 of your favorite bands, TV shows, movies, or books for the user to select from.
6. Create a form that uses three of the new HTML5 from control types and/or attributes.
Write an essay that talks about some of the best
coding practices we have discussed in class (was last lecture) OR
Create a form that submits to ‘processComment.cfm’ with 4 HTML5
form controls (either type or using HTML5 attributes), and provides
the user with a text area to submit comments to your
webpage.
Question 5:
<form action="myScript.php" method="post">
<!-- select list or drop down list -->
Select Books :
<select id="ddlBooks">
<option value="Three Mistaks of My Life">Three Mistaks of My Life</option>
<option value="Half Girlfriend">Half Girlfriend</option>
<option value="Five Point Someone">Five Point Someone</option>
</select>
<!-- submit button -->
<input type="submit" id="btnSubmit"/>
</form>
========================
Screen in the browser :
*******************************
Question 6:
<!-- html form with action and method attribute -->
<form action="processComment.cfm" method="post">
<!-- label to select date -->
<label for="dob">Date of Birth</label>
<!-- input type=date -->
<input type="date" id="dob"/>
<br><br>
<!-- label for color selection -->
<label for="color">Color</label>
<!-- input type=color -->
<input type="color" id="color"/>
<br><br>
<!-- lable for email -->
<label for="email">Email</label>
<!-- input type=email with placeholder and required attribute-->
<input type="email" id="email" placeholder="Enter Email" required/>
<br><br>
<!-- label for range -->
<label for="range">Select Number</label>
<!-- <input type=range -->
1<input type="range" id="range" min="1" max="10"/>10
<br><br>
<!-- lable for comment -->
<label for="comment">Comment</label>
<!-- textarea for comment -->
<textarea rows="5" cols="20" id="comment" maxlength="100" placeholder="Enter comment" autofocus="on"></textarea>
<br><br>
<!-- submit button -->
<input type="submit" id="btnSubmit" formnovalidate/>
</form>
=======================
Screen in the browser :