Contact Flash JavaScript Perl Bit Maps Vector Images Websites
Cookie Cart Frames Cart Frames Cart2 Form Phone Number Numbers
This is the Javascript section of my portfolio website. Click on the links above to be taken to each JavaScript example on the page. Click the Top button to be returned to the top of the page.
The first JavaScript example is a Shopping Cart using Cookies. Items are added to the shopping cart by clicking the Add to Cart button. When you move to the next page to order more items or to the Check Out page a temporary cookie is set. This cookie will only persist until your browser session is finished. When you get to the Check Out page each item that was put into the temporary cookie is seen in the table. You can remove items from the shopping cart by clicking the Remove Item button beside the appropriate item. You can also change the number of items ordered by changing the number in the Quantity field and pressing the tab key. Click the button below to try the Shopping Cart using Cookies out. JavaScript must be enabled in order for this feature to work.
Top
Another JavaScript example that I would like to show is a Shopping Cart using frames. Items can be added to the shopping cart by clicking the Add to Cart button. As each item is added to the shopping cart it is placed in a hidden field in the second frame. You can go to the second page of items to continue shopping by clicking the Page 2 button. When you are finished shopping click the Check Out Page button. The items that were added to the shopping cart are seen in the table on the Check Out Page. You can remove items from the shopping cart by clicking the Remove Item button beside the appropriate item. You can also change the number of items ordered by changing the number in the Quantity field and pressing the tab key. Click the button below to try the Shopping Cart using frames out. JavaScript must be enabled in order for this feature to work.
The second Shopping Cart example I would like to show using frames is the same as the first example except I have added another field. Under each item there is a choice of whether you want to order a soft or hard cover edition of the book. The user clicks either the Soft Cover or Hard Cover radio button. When the user gets to the Check Out page there is an additional category in the table as to whether the book ordered is a soft or hard cover edition. You can remove items from the shopping cart by clicking the Remove Item button beside the appropriate item. You can also change the number of items ordered by changing the number in the Quantity field and pressing the tab key. Click the button below to try the second Shopping Cart using frames out. JavaScript must be enabled in order for this feature to work.
A first JavaScript example using Regular Expressions is an Form Field Validation Exercise. There are eleven fields to validate like there would be on a order form. As the user enters information in each of the various fields and tabs to the next field the onChange event handler again evaluates the information entered in the field to determine if it is correct. A alert dialog box will come up if the information entered in the field is not appropriate. Click on the button below to try this JavaScript example out. JavaScript must be enabled in order for this feature to work.
A second JavaScript example using Regular Expressions is checking a phone number. The user is asked to type their phone number, including area code and then they tab over to the next field. The onChange event handler checks to see that the information entered is in the correct format. If the format is not correct then an alert dialog box will come up informing the user of the correct set up for the area code and phone number. Click on the button below to try this JavaScript example out. JavaScript must be enabled in order for this feature to work.
The last JavaScript example that I would like to show is form validation using Regular Expressions. The example is checking a form field for the present of numbers. The user is asked to type in their name and then they tab over to the second field and the onChange event handler is used to check the information in the name field to see if the user entered any numbers. If there are numbers in the name field an alert dialog box will come up telling the user they have entered numbers in the field. Click on the button below to try this JavaScript example out. JavaScript must be enabled in order for this feature to work.
JAVASCRIPT
JAVASCRIPT