processing online forms

8/12/2019 Processing Online Forms

http://slidepdf.com/reader/full/processing-online-forms 1/23

Processing Online Forms

Objectives

Define Online forms

Know the use of online forms

Discuss the content and input fields

Appreciate the use of online forms by

applying it to your project.

Create an online form for comments

and feedbacks

Online Forms

Online forms are Web pagespurposely designed for gathering

information of the internet.

The main use of online forms is to

gather feedback or opinion from the

users for data processing, usuallythrough a database.

Content

To start building an online form, youshould place inside the HTML body

tags the <form> </form> tags. Then,

you can organize it with the inputempty tag.

This is usually inside the <form> set of

tags and its attribute type specifies thekind of input you are going to have.

Another attribute, name, distinguishes

one input field from another.

Input Fields

◦ Text fields

◦ Radio buttons

◦ Check boxes

◦ Text areas

◦ Select fields

Text fields

The primary information that you wantto get from your Web page visitors

would be their name and location.

Use text fields when you want the user

to type letters or numbers in a form.

Text fields (continues)

First Name <br />

<input type=“text” name=“lastname” />Surname<br /> </form>

The web server will not know from which textfield the input came from without the NAMEattribute

First Name

Surname

To control the visible size of the textfield, we use the size attribute. If thesize attribute is missing, the default

value is usually set the by the browserto “20 ” – which stands for 20em.

<form>

<input type=“text” name=“firstname” /> First Name <br />

<input type=“text” name=“lastname” /> Surname<br />

<input type=“text” name=“location” size=“15” /> City orTown<br/>

</form>

Another important attribute ismaxlength. This sets the maximum

number of characters that can be

typed in the field. This attribute ishelpful in cases where we have

database length restrictions, or if we

know the exact or maximum numberof characters the user must provide.

<form>

<input type=“text” name=“firstname” /> First Name <br />

<input type=“text” name=“lastname” /> Surname<br />

<input type=“text” name=“location” size=“15” /> City or

Town<br/><input type=“text” name=“phone” size=“10” maxlength=“11” />

Cellphone Number <br />

<input type=“text” name=“email” size=“32” /> E-mail Address

</form>First Name

Surname

City or Town

Cell Phone

NumberE-mail Address

Radio buttons

Radio buttons are used when youwant the user to select only one option

from a list.

The type attribute here needs to beset to the value “radio”. Meanwhile, do

not forget the name attribute because

if you do, the user can only use oneamong the set of radio buttons in your

Radio buttons(continues)

The value attribute, which can be usedto set a default value to the input text

field, is also important.

A radio button without a value becomes meaningless when

submitted to the server because the

server won’t know what the buttonstands for.

<p><b>What type of movie do you mostly prefer to watch?</b></p>

<input type=“radio” name=“movietype” value=“action” /> Action

<input type=“radio” name=“movietype” value=“comedy” /> Comedy

<input type=“radio” name=“movietype” value=“drama” /> Drama

<input type=“radio” name=“movietype” value=“none” /> None of these

To group a set of related radio buttons

together, their name attribute should be one

and the same.

Note that only one option can bechosen. The checked attribute can be

used to set the default selection if we

want to indicate a pre-chosenselection.

<input type=“radio” name=“movietype”value=“none” checked/> None of

Check boxes

Check boxes are similar to radiobuttons, but are used when you want

to let the user select more than one

option among a number of choices. The type attribute is set to the value

“checkbox”.

Check boxes(continues)

<p><b>Where do you watch movies? Select all that apply</b></p><input type=“checkbox” name=“cinema” value=“action” /> Cinema

<input type=“checkbox” name=“home” value=“comedy” />Home

<input type=“checkbox” name=“computer” value=“drama” />Computer

<input type=“checkbox” name=“donotwatch” value=“none” />Don’t

Adding checked attribute to one of these buttons will mark that button

with a check when the page loads.

<input type=“checkbox” name=“donotwatch” value=“none”

checked/>Don’t watch

Text Areas

Text areas are text fields that havemore than one line for longer text

input. Usually, they are used as a

method to send comments orfeedback.

The tag changes to textarea

<textarea

name=“comments”></textarea>

Text Areas (continues)

You can specify the dimensions of thetextbox with the rows and cols

attributes, which stand for the number

of rows and columns.

<textarea name=“comments” rows=“5”

cols=“35”></textarea>

Text Areas (continues)

There is even the option to includedefault text to appear in the field when

the page loads.

<textarea name=“comments” rows=“5”

cols=“35”>Please provide any

additional comments.</textarea>

Select fields

Select field provides drop-downmenus that the user can access to beable to choose any information from agiven list.

<p><b>What is your agegroup?</b></p>

The select tag must have a name

attribute to identify the checkboxes.

Select fields(continuation)

The <option></option> tags define thetext that is displayed in the menu.

<p><b>What is your age group?</b></p>

<option value=“teenager”>younger than 20</option>

<option value=“youngperson”>between 21 and 35</option>

<option value=“noanswer ”>prefer not to say</option> </select>

Select fields(continuation)

You may add selected to show whichoption will be displayed when the page

loads. If not provided, the first item is

selected by default.

<option selected>prefer not to say</option>

processing online forms

Documents

cs108 lecture 22: web applications: forms 1 computer science...

creating and processing web forms

cogneesol's forms processing services - an overview

new! online forms!

online application forms marketing promotions

fast track your forms processing application development

online forms and workflow training - intranet...

blumberg forms online

december 1998 forms automation processing survey

fill out patient forms online

automated forms processing - paperless productivity

building accessible online forms & surveys

optimizing online forms

electronic forms processing with perfectforms benefits...

online membership processing

forms processing services

online processing

word processing spreadsheets presentations drawings ...

postgraduate research management€¦ · online forms phd...

best forms processing services