Your SlideShare is downloading. ×
Html Forms and Input
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Html Forms and Input

155

Published on

Published in: Education, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
155
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
10
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. M. Shoaib Farooq 1 HTML Forms and Input ● HTML Forms are used to select different kinds of user input. ● A form is an area that can contain form elements. ● Form elements are elements that allow the user to enter information (like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc.) in a form.
  • 2. M. Shoaib Farooq 2 Form Tag ● A form is defined with the <form> tag. <form> <input> <input> </form>
  • 3. M. Shoaib Farooq 3 Input ● The most used form tag is the <input> tag. The type of input is specified with the type attribute. ● Syntax <input type= “ “ name=“….” value=“…”>
  • 4. M. Shoaib Farooq 4 Text Fields ● Text fields are used when you want to type letters, numbers, etc. in a form. <form> First name: <input type="text" name="firstname"> <br> Last name: <input type="text" name="lastname"> </form> * the width of the text field is 20 characters by default
  • 5. M. Shoaib Farooq 5 Radio Buttons ● Radio Buttons are used when you want the user to select one of a limited number of choices. <form> <input type="radio" name=“Gender" value="male"> Male <br> <input type="radio" name=“Gender" value="female"> Female </form>
  • 6. M. Shoaib Farooq 6 Checkboxes ● Checkboxes are used when you want to select one or more options of a limited number of choices. <form> <input type="checkbox" name="bike"> I have a bike <br> <input type="checkbox" name="car"> I have a car </form>
  • 7. M. Shoaib Farooq 7 Simple drop down box Or Combo Box ● A drop-down box is a selectable list. <html> <body> <form> <select name="cars"> <option value="volvo">Volvo <option value="saab">Saab <option value="fiat">Fiat <option value="audi">Audi </select> </form> </body> </html>
  • 8. M. Shoaib Farooq 8 Text Area ● In a text-area you can write an unlimited number of characters. <html> <body> <form> <select name="cars"> <option value="volvo">Volvo <option value="saab">Saab <option value="fiat">Fiat <option value="audi">Audi </select> </form> </body> </html>
  • 9. M. Shoaib Farooq 9 Create a button <html> <body> <form> <input type="button" value=“Save"> </form> </body> </html>
  • 10. M. Shoaib Farooq 10 HTML Tables ● Tables are defined with the <table> tag. A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). ● The letters td stands for "table data," which is the content of a data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, etc.
  • 11. M. Shoaib Farooq 11 Example <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table>

×