HTML and CSS Reference
In-Depth Information
to multipart/form-data so that binary data can be sent. Next, a progress ele-
ment is added and incremented over the one that appeared on the first form:
Next, a fieldset and legend is created for the tip details area. A date/time input field
is added for the local date and time of the news incident. A textarea element is used
for gathering the tip details, and a file input is used for allowing a supporting file to be
attached, if necessary:
<legend>Enter Tip Details</legend>
type="datetime-local" /></label></p>
<p><label>Attach supporting file: <input type="file"
Next, a range input type is added as an “importance” slider for the tip. The fieldset
is then closed. Next to the slider is a read-only text input field that includes placeholder
text to indicate that a higher value on the slider means “more urgent”:
<p><label>Urgency: <input type="range" name="range"
id="range" min="1" max="10" /><input
id="rvalue" placeholder="more urgent" readonly /></label>
Using JavaScript, we'll make the value in the read-only text input update dynamically
when the slider is moved. We'll set the placeholder text to indicate that a high number
on the slider means “most urgent” and update the text input to the value of the slider
when the slider is moved. The JavaScript is added in a script element in the head of
the document:
Search WWH ::

Custom Search