16 Input Type Search Search Google: 17 Input Type Time Select a time: Submit 18 Input Type Week Submit
16 Input Type Search Search Google: 17 Input Type Time Select a time: Submit 18 Input Type Week Submit
Database System Concepts
7th Edition
ISBN:9780078022159
Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Chapter1: Introduction
Section: Chapter Questions
Problem 1PE
Related questions
Question
Use forms to create a web page(html) as shown in this pictures
![## HTML Input Types and Attributes
### 16. Input Type Search
##### Search Google:
<form>
<label for="search-google">Search Google:</label>
<input type="search" id="search-google" name="search-google">
<input type="submit" value="Submit">
</form>
### 17. Input Type Time
##### Select a time:
<form>
<label for="time-select">Select a time:</label>
<input type="time" id="time-select" name="time-select">
<input type="submit" value="Submit">
</form>
### 18. Input Type Week
##### Select a week:
<form>
<label for="week-select">Select a week:</label>
<input type="week" id="week-select" name="week-select">
<input type="submit" value="Submit">
</form>
### 19. The value Attribute
##### First name:
<form>
<label for="first-name-value">First name:</label>
<input type="text" id="first-name-value" name="first-name-value" value="John">
<label for="last-name-value">Last name:</label>
<input type="text" id="last-name-value" name="last-name-value">
</form>
### 20. The readonly Attribute
##### First name:
<form>
<label for="first-name-readonly">First name:</label>
<input type="text" id="first-name-readonly" name="first-name-readonly" value="John" readonly>
<label for="last-name-readonly">Last name:</label>
<input type="text" id="last-name-readonly" name="last-name-readonly">
</form>
### 21. The disabled Attribute
##### First name:
<form>
<label for="first-name-disabled">First name:</label>
<input type="text" id="first-name-disabled" name="first-name-disabled" value="John" disabled>
<label for="last-name-disabled">Last name:</label>
<input type="text" id="last-name-disabled" name="last-name-disabled">
</form>
### 22. The size Attribute
##### First name:
<form>
<label for="first-name-size">First name:</label>
<input type="text" id="first-name-size" name="first](/v2/_next/image?url=https%3A%2F%2Fcontent.bartleby.com%2Fqna-images%2Fquestion%2Fc385d418-0a2d-4566-8012-72f927db9034%2F79c7b117-d8a8-4510-9e5b-f1f742641757%2Fywvitx_processed.png&w=3840&q=75)
Transcribed Image Text:## HTML Input Types and Attributes
### 16. Input Type Search
##### Search Google:
<form>
<label for="search-google">Search Google:</label>
<input type="search" id="search-google" name="search-google">
<input type="submit" value="Submit">
</form>
### 17. Input Type Time
##### Select a time:
<form>
<label for="time-select">Select a time:</label>
<input type="time" id="time-select" name="time-select">
<input type="submit" value="Submit">
</form>
### 18. Input Type Week
##### Select a week:
<form>
<label for="week-select">Select a week:</label>
<input type="week" id="week-select" name="week-select">
<input type="submit" value="Submit">
</form>
### 19. The value Attribute
##### First name:
<form>
<label for="first-name-value">First name:</label>
<input type="text" id="first-name-value" name="first-name-value" value="John">
<label for="last-name-value">Last name:</label>
<input type="text" id="last-name-value" name="last-name-value">
</form>
### 20. The readonly Attribute
##### First name:
<form>
<label for="first-name-readonly">First name:</label>
<input type="text" id="first-name-readonly" name="first-name-readonly" value="John" readonly>
<label for="last-name-readonly">Last name:</label>
<input type="text" id="last-name-readonly" name="last-name-readonly">
</form>
### 21. The disabled Attribute
##### First name:
<form>
<label for="first-name-disabled">First name:</label>
<input type="text" id="first-name-disabled" name="first-name-disabled" value="John" disabled>
<label for="last-name-disabled">Last name:</label>
<input type="text" id="last-name-disabled" name="last-name-disabled">
</form>
### 22. The size Attribute
##### First name:
<form>
<label for="first-name-size">First name:</label>
<input type="text" id="first-name-size" name="first
![### HTML Form Attributes Explained
In this section, we will explore various HTML form attributes which make form handling more effective and user-friendly. Below are examples showcasing different attributes with practical usage scenarios.
#### 23. The maxlength Attribute
**Purpose**: Restrict the maximum number of characters that can be entered in an input field.
**Example**:
```
First name: <input type="text" name="firstname" maxlength="10">
Last name: <input type="text" name="lastname" maxlength="10">
```
#### 24. The novalidate Attribute
**Purpose**: Disable the automatic validation before submitting the form.
**Example**:
```
E-mail: <input type="email" name="email" novalidate>
<input type="submit" value="Submit">
```
#### 25. The autofocus Attribute
**Purpose**: Automatically focus the specified field when the page loads.
**Example**:
```
First name: <input type="text" name="firstname" autofocus>
Last name: <input type="text" name="lastname">
<input type="submit" value="Submit">
```
#### 26. The formmethod Attribute
**Purpose**: Define the HTTP method to use when sending form-data.
**Example**:
```
First name: <input type="text" name="firstname">
Last name: <input type="text" name="lastname">
<input type="submit" value="Submit">
<input type="submit" value="Submit using POST" formmethod="post">
```
#### 27. The formtarget Attribute
**Purpose**: Specify a name or keyword that indicates where to display the response after submitting the form.
**Example**:
```
First name: <input type="text" name="firstname">
Last name: <input type="text" name="lastname">
<input type="submit" value="Submit as normal">
<input type="submit" value="Submit to a new window/tab" formtarget="_blank">
```
#### 28. The multiple Attribute
**Purpose**: Allow multiple values for an input element.
**Example**:
```
Select images: <input type="file" name="images" multiple>
<input type="submit" value="Submit">
```
#### 29. The pattern Attribute
**Purpose**: Specify a regular expression that the input field's value is checked against.
**Example**:
```
Country code: <input type="](/v2/_next/image?url=https%3A%2F%2Fcontent.bartleby.com%2Fqna-images%2Fquestion%2Fc385d418-0a2d-4566-8012-72f927db9034%2F79c7b117-d8a8-4510-9e5b-f1f742641757%2Fizmshb5_processed.png&w=3840&q=75)
Transcribed Image Text:### HTML Form Attributes Explained
In this section, we will explore various HTML form attributes which make form handling more effective and user-friendly. Below are examples showcasing different attributes with practical usage scenarios.
#### 23. The maxlength Attribute
**Purpose**: Restrict the maximum number of characters that can be entered in an input field.
**Example**:
```
First name: <input type="text" name="firstname" maxlength="10">
Last name: <input type="text" name="lastname" maxlength="10">
```
#### 24. The novalidate Attribute
**Purpose**: Disable the automatic validation before submitting the form.
**Example**:
```
E-mail: <input type="email" name="email" novalidate>
<input type="submit" value="Submit">
```
#### 25. The autofocus Attribute
**Purpose**: Automatically focus the specified field when the page loads.
**Example**:
```
First name: <input type="text" name="firstname" autofocus>
Last name: <input type="text" name="lastname">
<input type="submit" value="Submit">
```
#### 26. The formmethod Attribute
**Purpose**: Define the HTTP method to use when sending form-data.
**Example**:
```
First name: <input type="text" name="firstname">
Last name: <input type="text" name="lastname">
<input type="submit" value="Submit">
<input type="submit" value="Submit using POST" formmethod="post">
```
#### 27. The formtarget Attribute
**Purpose**: Specify a name or keyword that indicates where to display the response after submitting the form.
**Example**:
```
First name: <input type="text" name="firstname">
Last name: <input type="text" name="lastname">
<input type="submit" value="Submit as normal">
<input type="submit" value="Submit to a new window/tab" formtarget="_blank">
```
#### 28. The multiple Attribute
**Purpose**: Allow multiple values for an input element.
**Example**:
```
Select images: <input type="file" name="images" multiple>
<input type="submit" value="Submit">
```
#### 29. The pattern Attribute
**Purpose**: Specify a regular expression that the input field's value is checked against.
**Example**:
```
Country code: <input type="
Expert Solution
![](/static/compass_v2/shared-icons/check-mark.png)
This question has been solved!
Explore an expertly crafted, step-by-step solution for a thorough understanding of key concepts.
This is a popular solution!
Step 1Define a search field (like a site search, or Google search):
VIEWStep 2Define a control for entering a time (no time zone):
VIEWStep 3Display a Week Input Control
VIEWStep 4The form name attribute
VIEWStep 5The input readonly attribute
VIEWStep 6The input disabled attribute
VIEWStep 7The input size attribute
VIEWStep 8The input maxlength attribute
VIEWStep 9The form novalidate attribute
VIEWStep 10The autofocus attribute
VIEWTrending now
This is a popular solution!
Step by step
Solved in 10 steps
![Blurred answer](/static/compass_v2/solution-images/blurred-answer.jpg)
Knowledge Booster
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.Recommended textbooks for you
![Database System Concepts](https://www.bartleby.com/isbn_cover_images/9780078022159/9780078022159_smallCoverImage.jpg)
Database System Concepts
Computer Science
ISBN:
9780078022159
Author:
Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:
McGraw-Hill Education
![Starting Out with Python (4th Edition)](https://www.bartleby.com/isbn_cover_images/9780134444321/9780134444321_smallCoverImage.gif)
Starting Out with Python (4th Edition)
Computer Science
ISBN:
9780134444321
Author:
Tony Gaddis
Publisher:
PEARSON
![Digital Fundamentals (11th Edition)](https://www.bartleby.com/isbn_cover_images/9780132737968/9780132737968_smallCoverImage.gif)
Digital Fundamentals (11th Edition)
Computer Science
ISBN:
9780132737968
Author:
Thomas L. Floyd
Publisher:
PEARSON
![Database System Concepts](https://www.bartleby.com/isbn_cover_images/9780078022159/9780078022159_smallCoverImage.jpg)
Database System Concepts
Computer Science
ISBN:
9780078022159
Author:
Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:
McGraw-Hill Education
![Starting Out with Python (4th Edition)](https://www.bartleby.com/isbn_cover_images/9780134444321/9780134444321_smallCoverImage.gif)
Starting Out with Python (4th Edition)
Computer Science
ISBN:
9780134444321
Author:
Tony Gaddis
Publisher:
PEARSON
![Digital Fundamentals (11th Edition)](https://www.bartleby.com/isbn_cover_images/9780132737968/9780132737968_smallCoverImage.gif)
Digital Fundamentals (11th Edition)
Computer Science
ISBN:
9780132737968
Author:
Thomas L. Floyd
Publisher:
PEARSON
![C How to Program (8th Edition)](https://www.bartleby.com/isbn_cover_images/9780133976892/9780133976892_smallCoverImage.gif)
C How to Program (8th Edition)
Computer Science
ISBN:
9780133976892
Author:
Paul J. Deitel, Harvey Deitel
Publisher:
PEARSON
![Database Systems: Design, Implementation, & Manag…](https://www.bartleby.com/isbn_cover_images/9781337627900/9781337627900_smallCoverImage.gif)
Database Systems: Design, Implementation, & Manag…
Computer Science
ISBN:
9781337627900
Author:
Carlos Coronel, Steven Morris
Publisher:
Cengage Learning
![Programmable Logic Controllers](https://www.bartleby.com/isbn_cover_images/9780073373843/9780073373843_smallCoverImage.gif)
Programmable Logic Controllers
Computer Science
ISBN:
9780073373843
Author:
Frank D. Petruzella
Publisher:
McGraw-Hill Education