0

I have put together what I believe my homework assignment is asking me to do, but I can't get the form to add the vehicle information. Here is the code. Can someone help me get onto the correct path? Thanks

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>
        Automobile
    </title>
</head>

<body>
<h2>Automobile</h2>   
    <script type="text/javascript">
    /*
    Shane Faulkwell
    FA4241307
    CST140
    PROGRAMMING IN JAVASCRIPT
    Programming Assignment 4
    */  
    <!--HIDE FROM INCOMPATIBLE BROWSERS
        function Vehicle() {
            this.make = make;
            this.model = model;
            this.year = year;
            this.color = color;
            this.engine = engine;
            this.drive = drive;
            this.getVehicle = getVehicleInfo;
            this.updateVehicle = updateSelectedVehicle;
        }

        var vehicleList = new Vehicle();    
            document.write("<p>Make: " + vehicleList.make);
            document.write("<br />Model: " + vehicleList.model);
            document.write("<br />Year: " + vehicleList.year);
            document.write("<br />Color: " + vehicleList.color);
            document.write("<br />Engine: " + vehicleList.engine);
            document.write("<br />Drive: " + vehicleList.drive + "</p>")

        function addVehicle() {
            if (document.forms[3].make.value == ""
                || document.forms[3].model.value == "")
                window.alert("You must enter the vehicle&#39;s make and model.");
            else {
                if (document.forms[3].vehicle.options[0].value == "vehicle")
                    document.forms[3].vehicle.options[0] = null;
                var newVehicle = vehicleList.length;
                vehicleList[newVehicle] = new Vehicle();
                vehicleList[newVehicle].make
                    = document.forms[3].make.value;
                vehicleList[newVehicle].model
                    = document.forms[3].model.value;
                vehicleList[newVehicle].year
                    = document.forms[3].year.value;
                vehicleList[newVehicle].color
                    = document.forms[3].color.value;
                vehicleList[newVehicle].engine
                    = document.forms[3].engine.value;
                vehicleList[newVehicle].drive
                    = document.forms[3].drive.value;
                var createVehicle = new Option();
                createVehicle.value = vehicleList[newVehicle].make 
                + ", " + vehicleList[newVehicle].model;
                createVehicle.text = vehicleList[newVehicle].make
                + ", " + vehicleList[newVehicle].model;
                var numVehicle
                    = document.forms[3].vehicle.options.length;
                    document.forms[3].vehicle.options[numVehicle] = createVehicle;
            }
        }
            function getVehicleInfo() {
                document.forms[3].make.value = this.make;
                document.forms[3].model.value = this.model;
                document.forms[3].year.value = this.year;
                document.forms[3].color.value = this.color;
                document.forms[3].engine.value = this.engine;
                document.forms[3].drive.value = this.drive;
            }
            function updateSelectedVehicle(curIndex) {
                this.make = document.forms[3].make.value;
                this.model = document.forms[3].model.value;
                this.year = document.forms[3].year.value;
                this.color = document.forms[3].color.value;
                this.engine = document.forms[3].engine.value;
                this.drive = document.forms[3].drive.value;
                document.forms[3].vehicle.options[curIndex].value
                    = this.make + ", " + this.model;
                document.forms[3].vehicle.options[curIndex].text
                    = this.make + ", " + this.model;
                window.alert("Vehicle information updated.");
            }
            function deleteVehicle() {
                var selectedVehicle = 0;
                var vehicleSelected = false;

                while (selectedVehicle < document.forms[3].vehicle.length) {
                    if (document.forms[3].vehicle.options[selectedVehicle].selected== true) {
                        vehicleSelected = true;
                        break;
                    }
                ++selectedVehicle;
                }
                if (vehicleSelected == true) {
                    document.forms[3].vehicle.options[selectedVehicle] = null;
                    vehicleList.splice(selectedVehicle, 1;
                }
                else
                    window.alert("You must select a vehicle in the list.");
            }
    // STOP HIDING FROM INCOMPATIBLE BROWSERS -->
    </script>


    <form action="">
        <p><input type="button" value="Add Vehicle" style="width: 150px" onclick="addVehicle()" />
        <input type="button" value="Delete Vehicle" onclick="deleteVehicle()" style="width: 150px" />
        <input type="button" value="Update Vehicle" onclick="vehicleList[document.forms[3].vehicle.selectedIndex]
            .updateVehicle(document.forms[3].vehicle.selectedIndex);" style="width: 150px" />
        </p>
        <table border="0">
            <tr>
                <td><select name="vehicles" size="13" style="width: 250px" 
                    onclick="vehicleList[this.selectedIndex].getVehicle();">
                <option value="vehicles">Vehicles</option></select>
                </td>
                <td>Make<br />
                    <input type="text" name="make" size="20" /><br />
                    Model<br />
                    <input type="text" name="model" size="20" /><br />
                    Year<br />
                    <input type="text" name="year" size="20" /><br />
                    Color<br />
                    <input type="text" name="color" size="20" /><br />
                    Engine<br />
                    <input type="text" name="engine" size="20" /><br />
                    Drive<br />
                    <input type="text" name="drive" size="20" /><br />
                </td>
            </tr>
        </table>
    </form>
</body>

</html>

2
Contributors
3
Replies
4
Views
5 Years
Discussion Span
Last Post by UNoHu
0

Here is the actual assignment. Maybe I am reading too much into what it is asking me.

Create an html document that includes a JavaScript program that creates a new constructor function named Automobile in the document head. Include at least five properties in the object definition, such as make, model, color, engine, seats, and so forth. Then assign the values of your car to each of the Automobile properties. Print the properties to the screen.

0

That is a very vague assignment and could have many answers but this would be my interpretation of it:

function Automobile(make, model, colour, engine, seats) {
    this.make = make;
    this.model = model;
    this.colour = colour;
    this.engine = engine;
    this.seats = seats;
}

var myCar = new Automobile('Peugeot', '307', 'Blue', '2.6 litre GTi', 5);

document.write('My car is a ' + myCar.colour + ', ' + myCar.make + ' ' + myCar.model + '. It has a ' + myCar.engine + ' engine and ' + myCar.seats + ' seats.');

Edited by JJenZz

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.