lesson 4 advanced forms handling. aggravations long forms that make you scroll out of the normal...
Post on 18-Dec-2015
214 views
TRANSCRIPT
Lesson 4
Advanced Forms Handling
Aggravations
• Long forms that make you scroll out of the normal viewing area
• Lets create a scrollable form that is a viewport for the data and scroll the data through the viewport.
My Scrolling Data Form
Database simulation
• Since we don’t have a database at our disposal we’ll simulate that we have a CGI program that will run on the server and query our data out of a database.
• The CGI program will then create some dynamic Javascript that will load the data into a set of Javascript arrays
• The way the form asks the server to run the CGI program is by placing the URL of the CGI program in the SRC attribute of a <SCRIPT> tag defined in the form’s <head> section
• The CGI program could be a server-side PERL Script, ASP page, PHP page, Cold Fusion or even a Java servlet or JSP
• For this exercise the file mydata.js will represent the dynamic Javascript created by the CGI program
What to do…
• Start out with the files: myForm.htm and mydata.js
• Add event handlers for the “Scroll up” and “Scroll down” buttons– Define functions to accomplish the scrolling
• Don’t let the user scroll the viewport out of the data (up or down)– Ring a bell or display an alert to notify users that they can’t scroll any further
• Add event handler for the “Add” button– New data should always be added at the end of the arrays and shown to
the user by scrolling the last 5 rows of the arrays into the viewport
– This action would normally send the “Add” data to a CGI program on the server to update a database
• Add an event handler for the “Delete” radio buttons– Delete the elements indicated by the radio button and refresh the viewport
– This action would normally send a “Delete” request to a CGI program running on the server to update a database