Technologies for web publishing

Ing. Václav Freylich

Lecture 4

aTNPW1-4

Content

Forms in HTML

aTNPW1-4

HTML forms

Allows the user-page interactivity Used for the user data input Offer a lot of controls Posted form is processed on the web server by dynamic

website (script)

aTNPW1-4

Forms - syntax

Form body <form></form>

Most important attributes:action URL address of the script (form processing)method data sending method - GET / PUT (implicitly GET)

aTNPW1-4

Forms – data sending methods

Data sending methods get

- data values are the part of the URL address- used for short forms with the text data- data values are visible in URL – DANGEROUS !

post - data values are sent to the web server separately- used for large forms, passwords, files, …

aTNPW1-4

Forms - syntax

Input control – input (always non-pair element)<input type="text" name= "user" value= "User name" size="10" maxlength="15" />

type control typetext, password, checkbox, radio, submit, reset, button, image, hidden, file

name control namevalue initial value of the control

aTNPW1-4

Forms - syntax

Buttons<input type="submit" name="frm_submit" value="Submit

form" />

type control type = button function (submit, reset)name control namevalue button caption

aTNPW1-4

Forms - syntax

Textarea (pair element)<textarea cols="50" rows="5" name="myarea"></textarea>

Pair element for longer text input

rows number of visible rowscols width (number of chars on the row)

Textarea control has automatic scroll bars available if the total length of the text is longer than the textarea size

aTNPW1-4

Forms - syntax

Select boxContains the items - option elements

Values of selected items only are sent to the server

<select name="sel_items" size="3" multiple="multiple"> <option value="1" selected="selected">Item 1</option> <option value="2">Item 2</option> <option value="3">Item 3</option> <option value="4">Item 4</option></select>

size number of visible items multiple allows multiple selection

aTNPW1-4

Forms - syntax

Control group – <fieldset></fieldset>For grouping the controls (the set has a visual border)

Fieldset caption - <legend></legend>- Crerates the caption of the control group made by fieldset

<form action="some_script.php" method="post"><fieldset><legend>User login</legend>Login<input type="text" name= "login" size="10" />Password<input type="password" name= "pwd"

size="10" /><input type="submit" value= "Enter" /></fieldset></form>