Synetic College Logo
Unit 3 of 4 · BCA Sem 2

Unit 3: Forms

Web Technologies notes · PTU syllabus (UGSEC2505)

3 min read4 topics8 exam questions
On this page
  1. Unit summary
  2. The form element
  3. Text, password and button controls
  4. Checkboxes and radio buttons
  5. Textarea and select lists
  6. Key terms
  7. Quick revision
  8. Important questions

Unit summary

Forms are how users send information to a website — logins, registrations, feedback and payments. This unit covers the form element and every input control: text, password, buttons, submit, reset, checkboxes, radio buttons, text areas and select lists.

After this unit you can

  • Create a form with the action and method attributes
  • Use text, password, button, submit and reset inputs
  • Use checkboxes, radio buttons, textareas and select lists correctly
  • Design a complete registration form

PTU syllabus topics

  • The form object and its methods — text
  • password
  • button
  • submit
  • reset
  • checkbox
  • radio
  • textarea
  • select and multi-choice select list elements
ClassificationForm elements
<form>

  • Text and password

    Single-line input

  • Radio buttons

    Choose one option

  • Checkboxes

    Choose several options

  • Select list

    Dropdown of options

  • Textarea

    Multi-line text

  • Submit and reset

    Send or clear the form

1

Topic 1

The form element

html<form action="register.php" method="post">
  ...controls...
</form>
  • action: where the data is sent (a server script).
  • method: GET sends data in the URL (visible, limited length, for searches); POST sends it in the request body (hidden, for passwords and large data).
ComparisonGET vs POST
GET
POST

Data location

In the URL

In the request body

Visibility

Visible

Not visible in the URL

Size

Limited

Large

Use

Search, filters

Login, registration, uploads

2

Topic 2

Text, password and button controls

ControlCodePurpose
Text box<input type="text" name="uname">Single line of text
Password<input type="password" name="pwd">Hides typed characters
Submit<input type="submit" value="Register">Sends the form
Reset<input type="reset">Clears all fields
Button<input type="button" value="Check" onclick="check()">Runs a script

Useful attributes: name (identifies the data), value, placeholder, maxlength, size and required.

3

Topic 3

Checkboxes and radio buttons

  • Checkbox: choose any number of options. <input type="checkbox" name="skills" value="C++"> C++
  • Radio button: choose only one option from a group; all buttons in the group share the same name. <input type="radio" name="gender" value="F"> Female
  • checked pre-selects an option.

Exam tip

Radio buttons in a group must have the same name — otherwise more than one can be selected. This is a common practical mistake.

4

Topic 4

Textarea and select lists

  • Textarea: multi-line text such as an address: <textarea name="address" rows="4" cols="40"></textarea>
  • Select (drop-down) list:
html<select name="course">
  <option value="bca">BCA</option>
  <option value="bba" selected>BBA</option>
</select>
  • Multi-choice select list: add multiple (and often size) so the user can select several options with Ctrl.
ClassificationForm controls at a glance
Form

  • Text input

    Name, email

  • Password

    Hidden typing

  • Radio

    One of many

  • Checkbox

    Many of many

  • Select

    Drop-down choice

  • Textarea

    Long text

  • Submit and reset

    Send or clear

Key terms

Form
An HTML element that collects user input
action
The URL that receives the form data
method
How data is sent: GET or POST
Radio button
An input allowing only one choice in a group
Textarea
A multi-line text input

Quick revision

  • form action = where; method = how (GET/POST).
  • POST for passwords and large data.
  • Checkbox = many choices; radio = one choice (same name).
  • select + option = drop-down; add multiple for many.

Important exam questions

Practice questions written to the PTU exam pattern for this unit's syllabus: short answers (Section A style) and long answers (Sections B and C style).

Short-answer questions

  1. Q1.Differentiate between GET and POST methods.
  2. Q2.Differentiate between a checkbox and a radio button.
  3. Q3.What is the use of a reset button?
  4. Q4.How do you create a multi-choice select list?
  5. Q5.What is a textarea?

Long-answer questions

  1. Q1.Design a student registration form using all the form controls and explain each.
  2. Q2.Explain the form element and its attributes with an example.
  3. Q3.Explain the different input types available in HTML forms.

Stuck on this unit?

Message SBS on WhatsApp for help with Web Technologies, or to ask about studying BCA at Synetic.

WhatsApp us