I have these steps to follow in order to accomplish an ajax request to a cgi server:

Create a Web Application that can be used as a mileage calculator. Your html page (assign12.html) must include four input fields representing the start city, start state, destination city, and destination state. The four input elements must use the following values for the "name attribute" of each input element: startCity, startState, endCity, endState. Be sure you spell the names correctly when you build the query string that you will append to the URL to make the Ajax request to run my C++ CGI program. The web page must make an AJAX request to the following URL: /cgi-bin/cs213/mileageAjaxJSON.

Your query string must be appended to this URL. The CGI program returns the mileage data as JSON text. Here is a sample format of the JSON text string. Warning: the tmode array may be missing sometimes!

{ "trip" :{ "startcity" : "Boise","startstate" : "ID","endcity" : "Denver","endstate" : "CO","miles" : "814","tmode" :["Plane","Car","Bus","Bike","Foot"]}}

You must then incorporate the content from this JSON text string into the existing web page so that it looks professional. Note: You may get the data using the XMLHttpRequest object's responseText property. Call JSON.parse() to convert the JSON string in responseText to a JavaScript object. The content must be retrieved from the JavaScript object and formatted nicely to be displayed in your web page. Display the content only, not the JSON string!

The state input field in your HTML page must only allow two characters.

You must do client side validation to be sure the form is completely fill out. Warning: Do not send the AJAX request via a <form> tag using the action attribute or onsubmit event. This causes problems because the form is reset on a successful send. Make the AJAX request using an onclick event from a standard button or other element.

The part where I'm stuck is that I don't know if I should look for parameters or not.

This is the code I have thus far

function mileage() {
    mileage = new XMLHttpRequest();
    mileage.onload = function () {
        document.getElementById("response").innerHTML = this.responseText;
        startcity = document.getElementById("startCity").innerHTML;
        startstate = document.getElementById("startState").innerHTML;
        endcity = document.getElementById("endcity").innerHTML;
        endstate = document.getElementById("endState").innerHTML;
    }
    mileage.open("GET", "/cgi-bin/cs213/mileageAjaxJSON?q="+startcity+"&q2="+startstate+"&q3="+endcity+"&q4="+endstate, true);
    mileage.send();