Forms are tools in HTML that allow having interactivity in a document. The example of forms could be Pull Down Menu’s, List Selection, Check Box, Radio Buttons, Text Areas, etc. Lets consider a form for simple Pull Down Menu
Pull Down Menu Example:
This example will give a Pull down menu with options of Apple, Banana, Grape and Mango.
Taking the same example above, we can use for scrolling menu. The main difference in scrolling menu is to say select multiple instead of select as in above case.
Scrolling Menu Example:
The next type of forms is the checkbox. Lets take an example in which we create 3 checkbox’s. Of them 2 are unchecked and 1 is checked.
The example above can be converted for Radio Buttons
Radio Buttons Example:
If you try this example out on the browser, you will find that it is not working, as you would have thought. This is because in the above example each Radio Button works individually. This will mean that if the initial value was unchecked then it will remain unchecked and if the initial value was checked then it will remain checked. To make them work together we modify the previous example as follows:
Modified Radio Button Example:
The next type of form would be textbox. The textbox allows us to define a box of particular length and predefined value. Consider the example below:
Textbox with Initial value Example:
An advanced form of Textbox is the TextArea. Consider the example below:
The next types of forms are the Submit and Reset buttons. Lets consider their examples:
Reset Button Example:
The Reset button is used to initialise the fields to default value. On the other hand the Submit button is used to send the information entered to some web page or website.
Whenever there is any kind of activity on a web browser, an event is generated. Whenever mouse enters a text area or clicks a link or goes over a link an event is generated. Similarly if a keyboard performs some activity on the web browser again event is generated. We will check an example of event that occurs when the mouse goes over a link.
Here q is the variable that stores 2. The variable p adds 11 to variable q and stores the value 13 in itself. The variable q will remain unaltered and still hold 2. Variables can also be used to hold strings. For example:
var name= “Zahid”;
Here the variable name will have value Zahid.
Adding 2 variables Example:
The answer in the above example is ‘70’. Actually we wanted an output of ’50 20’. To get this result we will need to modify this statement
Actually we can also do the following to get the desired result.
There are other functions associated with the string. Lets consider another example.
indexOf and lastIndexOf functions example:
If the string we are searching is not present then the ‘indexOf’ will return –1. Consider an Email checking example below.
Lets consider a Rolling Text Example script
Fruit Store Calculator:
Lets develop a calculator for a fruit store that will allow us to compute how much a customer has to pay. The customer selects the type of fruits and the quantity of those fruits and the total amount is output to him.
new Array(); // An array without specifying the size
new Array(size); // An array with the size
new Array(element1, element2, element3); // An array with three elements
Lets take an array example and try to learn from that.
From this example we can learn the following things:
· The first element of an array has index 0. Consequently the last element will be size-1.
· When an element of an array is empty or if we have not assigned any value to the array element then by default it is undefined.
· When an element of an array has to be accessed then the element number should be specified between [ ].
· An array can have mixed data types like integer, boolean, float, string, etc.
Cookies are little bits of information that you can leave on a user's hard drive, where they stay even after the user leaves your site or turns off the computer, which is extremely useful when you want to remember information about repeat visitors. Some rules must be remembered about the cookies
· Not everyone has a cookie-friendly browser (but most do).
· Not everyone who has a cookie-friendly browser will accept your cookies (but most will).
· Each domain is allotted only 20 cookies, so use them sparingly.
· Cookies must be no larger than 4 KB. That's just over 4,000 characters, which is plenty.
Lets consider an example to set the cookie
Cookie Setting example:
From the example above we can summarise our learning
· Setting of cookie is done by document.cookie property. The same property is used to extract the cookie value from the hard disk.
· The unescape() function will perform the opposite of escape() function.
· The function .split(:) (Implying split on colon), will split the the_cookie into 2 parts like an array and store it in broken_cookie. The broken_cookie will have the string “username” and broken_cookie will have the “name entered while storing the cookie”.
Frames and Framesets:
Lets consider a Frameset example in which we have 2 frames. Whatever we type in the first frame can be send to the second frame when Send button is checked. Since this is a frameset example, we will need 3 files.
· http://hotwired.lycos.com/webmonkey/html/97/06/index2a.html?collection=html - Forms Tutorial