Cool things I did at work this week
In my 9-5 job I get to develop web applications using HTML, CSS, JavaScript, and Coldfusion, and not much else.
I am currently migrating a project from an IT group to a development group within finance. In this project I am recreating a form using a ton of javascript, calendars, and some interesting hierarchical select boxes.
I finally found a use for AJAX that I could understand and apply. The hierarchy of select boxes requires that I first run a query and output the results to select box #1 (highest level of hierarchy). Upon selection (onChange event) within the select box #1 I have to display the relevant choices for selectbox #2. In order to do this I have to query the distinct values for selectbox options based on the selection in box#1. This requires I run back to the server without refreshing my current form. AJAX does this in the blink of an eye. So my select box#2 gets populated and that feeds the query for select box#3, and so on and so forth until we get to the 8th select box and the final query. All of this has error checking and sets default values along the way. Very nifty stuff.
The calendar function I incorporated was easy enough to find and uses a pop up window to allow selection of the dates. By making the date input fields readonly I was able to require the user use the calendar icon to pick a date thus insuring valid date selection. I also had to make the dates populate various sections of the form with the main date, but still allow users to change individual dates if desired. JavaScript for each date field gives me complete control.
I mastered several nested show/hide functions which keep the user from filling out items they do not need to. All of the Select options are fed via a reference table which is lightning fast. Separating the Form, JavaScript, and CFQueries into separate files is helping me stay organized. One other cool feature in the form is a mock multi-select using check boxes and a couple of div layers for styling purposes.
Upon submission I am doing a ton of form validation and if the user is successful will write all the form elements to 4 different tables. Some of the form items are multi selects or have an array of answers for one variable. For this I get to loop through the array and write to the table. One even requires nested looping to break apart a field value with pipe(|) delimiters. The final output writes all the fields passed and their values(including multiple selections as arrays) to a text file they can then print for their records.
While sometimes frustrating to manage all this code for one form, it has been a fabulous learning experience. Next I get to add an edit feature for all the values submitted.