// method to initialize the application
function init() {
// url where the application is running - change this to suit your needs
base_href = "http://localhost/form_components/";
// set focus to the first_name fields
Selection.setFocus("first_name");
// initialize the dataObj which will hold the data passed
// to CF via the sendData method
dataObj = new LoadVars();
// initialize the receive object that will handle the response from the server
receiveData = new LoadVars();
// once the response comes back the receive handler will be triggered
receiveData.onLoad = receiveHandler;
// set some default variables in dataObj
dataObj.notify = false;
dataObj.gender = "female";
// create the loadVars object that will handle loading
// the states from get_states.cfm
var statesObj = new LoadVars();
// once the states are loaded call the statesLoaded method
statesObj.onLoad = statesHandler;
// load the states
statesObj.load(base_href + "get_states.cfm");
}

Listing 2

// method to handle the birth date once it's selected
function getBirthDate() {
// call the getSelectedItem method of the calendar component
// given the instance name of birthDate_mc
birth_date = birthDate_mc.getSelectedItem();
// create a valid date object from the selected date
birth_date = new Date(birth_date);
// set the birth year
birth_year = birth_date.getFullYear();
// set the birth month, add 1 since the month is zero indexed
birth_month = birth_date.getMonth() + 1;
// set the birth day
birth_day = birth_date.getDate();
// format the birth_date as YYYY-MM-DD so we can pass this to CF
birth_date = birth_year + "-" + birth_month + "-" + birth_day;
// set the birth_date variable in dataObj
dataObj.birth_date = birth_date;
}

Listing 3

// method to set the selected state, from the combo box, in dataObj
function getState() {
dataObj.state = state_mc.getValue();
}

// method to set the selected gender, from the radio buttons, in dataObj
function getGender() {
dataObj.gender = gender_radio.getValue();
}

// method to set the notify flag, from the checkbox, in dataObj
function getNotify() {
dataObj.notify = notify_mc.getValue();
}

Listing 4

// method to send the data to CF
function sendData() {
// set input text values into our data object
dataObj.first_name = first_name;
dataObj.last_name = last_name;
dataObj.city = city;
dataObj.email = email
// since the comments field is assigned an instance name
// we access the text of the field via comments.text
dataObj.comments = comments.txt;
dataObj.sendAndLoad(base_href + "data_insert.cfm", receiveData);
}

Listing 5

// handles the response from the server after the information has been submitted
function receiveHandler(success) {
// if the transfer was successful display a success message
if(success) {
statusMessage_mc.setMessage("Thank you for filling out our form.
Your information has been recorded successfully.");
statusMessage_mc._visible = 1;
// disable the send clip so they can't send the information again
send_mc.setEnabled(false);
// if the transfer was not successful display an error message
} else {
statusMessage_mc.setMessage("Please be sure to fill out all required fields.");
statusMessage_mc._visible = 1;
}
}