The purpose of this webpage is to get feedback from the users of how they like this website. They can also provide information on what is their favorite single-engine low wing tricycle airplane to fly. And if they wish they can provide further informatation about this website and the functionality of this website.
This website does not actually perform any functionality. It is simply to demonstrate a multi-list pick list and update an array and a string from that information. The array and string are completely cleared of information and re-loaded with information each time the user changes focus ( blur ) away from the pick list. As the user changes their choices on the pick list nothing is actually happening to the array or string at that time. All the information on which items are selected ( or not selected ) and which items will be included in the string ( or not included ) are dynamically determined when the user navigates away from the pick list with either the mouse or the tab key to change focus. This is accomplished with the BLUR event in javascript. The text string that is determined from the pick list is shown to the user as part of a non user editable text table data area on the form, giving immediate feedback that the picker list and text string are updating with the blur/focus event.
The current date is shown on the webpage in a non user editable text table data field. The Reset Button returns the webpage to the original settings. The Submit button only shows an alert of the information the user has chosen as input. And when you try to navigate away from this webpage an alert message is shown ( with no real other information ) asking that would you like to leave this webpage or not. I tried briefly to show some other information besides the standard message for the onbeforeunload event, but was not able to get it to display anything else yet.
Finally, with a litle bit of CSS changes, I made the First Name, Last Name, E-mail, and additional textarea text boxes show a Red Background color while the information in them is invalid. As soon as the information in them becomes valid, the background color of the text boxes ( and e-mail address textbox ) change to a black background indicating that the information in the textbox passes the input validation of HTML5. Kinda cool and fun to watch the background in the e-mail address texbox change from red to black and back again and so forth as you type in an e-mail address and watch as HTML5 validates the input and shows the information is valid or not.