QUESTION
Instructions Summary You've been asked to create a survey web form for use in a seminar conference website. Some of the questions from the form are shown in Figure 7-60. Use your knowledge of HTML form elements to create the form elements and labels. Survey Questions 1. How satisfied were you with the conference workshops? a. Very Satisfied b. Satisfied c. Dissatisfied d. Very Dissatisfied 2. How satisfied were you with the conference speakers? a. Very Satisfied b. Satisfied c. Dissatisfied d. Very Dissatisfied 3. How satisfied were you with the conference facilities? a. Very Satisfied b. Satisfied c. Dissatisfied d. Very Dissatisfied 4. How likely are you to attend next year's conference? very unlikely very likely 5. Provide any suggestions for the next conference: enter your suggestions here
Instructions Tasks Open the file code7-2.html and in the comment section enter your name (First + Last) and the date (MM/DD/YYYY) into the Author: and Date: fields of the file. Open the code7-2.htm/ file and within the head section insert a link element linking the page to the code7-2_forms.css style sheet. Immediately after the hI tag create the form by enclosing the list of questions within opening and closing 〈form〉 tags. Give the form the action submitsurvey.php using the post method. The survey questions are marked as an ordered list. The first three questions include a nested list of options. For the first question do the following: 1. Mark the text from Very Satisfied to Very Dissatisfied as form labels. 2. Before each label insert a
The survey questions are marked as an ordered list. The first three questions include a nested list of options. For the first question do the following: 1. Mark the text from Very Satisfied to Very Dissatisfied as form labels. 2. Before each label insert a radio button belonging to the q1 field with default values of a through d. Assign the radio button controls the ids qla through qId. 3. Use the for attribute to associate each label with its radio button control. Repeat the previous task ("Create the first survey question") for questions 2 and 3 , naming the fields for those radio buttons $q 2$ and $q 3$ respectively and assigning the radio button controls the ids q2a through q2d for the second question and $q 3 a$ through $q 3 d$ for the third question.
Within the div element with the id newRow insert a range slider that ranges from 1 to 10 in steps of $\mathbf{1}$, with a default value of $\mathbf{5}$. Insert the text very unlikely before the range slider and the text very likely after the range slider. Assign the range slider the field name q4 . Mark the text Provide any suggestions for the next conference as a form label and use the for attribute to attach the label to the input control with the id q5text . Below the label, insert a textarea control with the id q5text and the field name q5. Add the placeholder text enter your suggestions here. Verify that the layout of form matches that shown in Figure 7-60. Task Verify that the layout of form matches that shown in Figure 7-60.
HTML Code:
<!doctype html>
<html lang="en">
<head>
<!--
New Perspectives on HTML5 and CSS3, 8th Edition
Tutorial 7
Coding Challenge 2
Author:
Date:
Filename: code7-2.html
-->
<meta charset="utf-8">
<title>Coding Challenge 7-2</title>
</head>
<body>
<h1>Survey Questions</h1>
<ol type="1">
<li>
How satisfied were you with the conference workshops?
<ol type="a">
<li>
Very Satisfied
</li>
<li>
Satisfied
</li>
<li>
Dissatisfied
</li>
<li>
Very Dissatisfied
</li>
</ol>
</li>
<li>
How satisfied were you with the conference speakers?
<ol type="a">
<li>
Very Satisfied
</li>
<li>
Satisfied
</li>
<li>
Dissatisfied
</li>
<li>
Very Dissatisfied
</li>
</ol>
</li>
<li>
How satisfied were you with the conference facilities?
<ol type="a">
<li>
Very Satisfied
</li>
<li>
Satisfied
</li>
<li>
Dissatisfied
</li>
<li>
Very Dissatisfied
</li>
</ol>
</li>
<li>
How likely are you to attend next year's conference?
<div id="newRow">
</div>
</li>
<li>
Provide any suggestions for the next conference:
</li>
</ol>
</body>
</html>
CSS Code:
@charset "utf-8";
/*
New Perspectives on HTML5 and CSS3, 8th Edition
Tutorial 7
Coding Challenge 2
Filename: code7-2_forms.css
*/
h1 {
font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
margin-left: 25px;
}
ol {
line-height: 1.5em;
}
input {
display: inline-block;
margin-right: 15px;
}
div#newRow {
margin-left: 25px;
}
input[type="range"] {
display: inline-block;
margin: 5px 10px;
width: 175px;
}
textarea {
width: 400px;
height: 100px;
display: block;
margin: 10px 0px 10px 20px;
padding: 3px;
}
I Need help w this code
Public Answer
