0% found this document useful (0 votes)
26 views4 pages

Creating HTML Forms Using Kompozer Notes

The document provides a detailed guide on creating HTML forms using KompoZer, a WYSIWYG web page editor. It covers the purpose of forms, common form controls, and step-by-step instructions for creating various form elements such as text fields, radio buttons, and submit buttons. Additionally, it highlights the advantages of using KompoZer for easy and visual form creation without needing to write HTML manually.
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
26 views4 pages

Creating HTML Forms Using Kompozer Notes

The document provides a detailed guide on creating HTML forms using KompoZer, a WYSIWYG web page editor. It covers the purpose of forms, common form controls, and step-by-step instructions for creating various form elements such as text fields, radio buttons, and submit buttons. Additionally, it highlights the advantages of using KompoZer for easy and visual form creation without needing to write HTML manually.
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Creating HTML Forms Using KompoZer — Detailed

Notes

1. What is a Form?
A form is a section of a webpage that allows users to enter and submit data.
Examples: login form, registration form, feedback form, contact form, online survey.
Purpose:
- Collect user information
- Send data to a server
- Allow interaction between user and website

Basic HTML structure:

form elements here

2. What is KompoZer?
KompoZer is a WYSIWYG web page editor used to create websites easily.

WYSIWYG means “What You See Is What You Get”. The page is designed visually and the HTML
code is generated automatically.

Features:
- Easy webpage design
- No need to remember HTML code
- Drag■and■drop editing
- Built■in form tools
- Free and open source

3. Form Controls
Form controls are elements used to collect user input.

Common controls:
- Text Field – enter short text
- Password Field – hidden password entry
- Radio Button – choose one option
- Check Box – choose multiple options
- Text Area – enter long text
- Drop■down List – choose from list
- Submit Button – send form data
- Reset Button – clear form

4. Steps to Create a Form in KompoZer


1. Open KompoZer.
2. Create new webpage: File → New → Blank Page.
3. Insert form: Insert → Form → Form.
4. A red dotted box appears showing the form area.

Form Properties:
- Action URL – location where form data is sent.
- Method – method used to send data.

Two methods:
- GET
- POST

5. Text Field
Used to enter single■line text like name or email.

Steps:
Insert → Form → Text Field

Properties:
- Field Name – name of field
- Initial Value – default value
- Size – width of box
- Maximum Length – maximum characters

6. Password Field
Used to enter password securely. Characters appear as dots or stars.

Steps:
Insert → Form → Text Field → choose Password Field

7. Radio Buttons
Radio buttons allow only one option to be selected from a group.

Example: Gender selection


Male / Female

Important rule:
All radio buttons in the same group must have the same name.

8. Check Boxes
Allow multiple selections.

Example:
Music
Sports
Reading

Steps:
Insert → Form → Check Box

9. Text Area
Used for entering long text like feedback or comments.

Steps:
Insert → Form → Text Area

Properties:
- Name
- Rows (height)
- Columns (width)

10. Drop■Down List


Allows user to select one option from a list.

Steps:
Insert → Form → Selection List

Example list:
India
USA
UK

11. Submit Button


Submit button sends form data to the server.
Steps:
Insert → Form → Submit Button

12. Reset Button


Reset button clears all entered data in the form.

Steps:
Insert → Form → Reset Button

13. Form Validation


Validation ensures correct data is entered before submission.

Examples:
- Email must contain @
- Password must have minimum characters
- Required fields must be filled

14. Example HTML Form


Name:

Password:

Gender:
Male
Female

Hobbies:
Music
Sports

15. Advantages of Using KompoZer


- Easy form creation
- Visual editing
- No need to write HTML manually
- Beginner friendly

You might also like