$(document).ready(
	    function() {
	        $('.rtHide').hide();

	        makeID = $('#QuoteRequestMakeDropDown').attr('value');
	        modelID = $('#QuoteRequestModelsDropDown').attr('value');

	        // call the populate makes function
	        populateMakes();

	        // check to see if the make box already contains a make.
	        if (($('#QuoteRequestMakeDropDown').val()) > 0) {
	            // this removed the duplicated make name at the specified index
	            document.getElementById('QuoteRequestMakeDropDown').options[1] = null;
	            $('#QuoteRequestModelsDropDown').removeAttr("disabled");
	        }

	        // now all the makes have been populated...
	        $('#QuoteRequestMakeDropDown').change(function() {
            // make the model dropdown enabled
            var makeID = $('#QuoteRequestMakeDropDown').attr('value');
            if (makeID != 0) {
                var currentModelID = document.getElementById("QuoteRequestModelsDropDown").value;
                populateModels(makeID);
                clearComboBox('QuoteRequestDerivativeDropDown');

                $('#QuoteRequestModelsDropDown').removeAttr("disabled");
                // lose the select make on the All Models drop down once a Make has been selected
                document.getElementById('QuoteRequestModelsDropDown').options[0] = null;

                // store the model ID as a var
                var makeID = $('#QuoteRequestMakeDropDown').attr('value');
                if (makeID > 0 && currentModelID > 0) {
                    populateDerivative(makeID, currentModelID);
                }                
                
            }
            else {
                $('#QuoteRequestModelsDropDown').attr("disabled", "disabled");
            }
        }
    );

	    // now all the makes have been populated...
	    $('#QuoteRequestModelsDropDown').change(function() {
	            clearComboBox('QuoteRequestDerivativeDropDown');
                // store the model ID as a var
                var currentModelID = document.getElementById("QuoteRequestModelsDropDown").value;
                var makeID = $('#QuoteRequestMakeDropDown').attr('value');
                if (makeID != 0)
                {
                    
                }
                populateDerivative(makeID, currentModelID);
            }
        );

            // now all the makes have been populated...
            $('#QuoteRequestModelsDropDown').click(function() {
                clearComboBox('QuoteRequestDerivativeDropDown');
                }
            );


	        // now all the makes have been populated...
	        $('#QuoteRequestMakeDropDown').click(function() {
                // initially, clear the models dropdown
                if (document.getElementById('QuoteRequestModelsDropDown').options.length > 0) {
                    clearComboBox('QuoteRequestModelsDropDown');
                    clearComboBox('QuoteRequestDerivativeDropDown');
                    addLoadingMessage('QuoteRequestModelsDropDown');
                    clearLoadingMessage('QuoteRequestModelsDropDown');
                }
            }
        );


	    }
    );

    function clearComboBox(BoxToClear) {
        for (var i = document.getElementById(BoxToClear).options.length; i > 0; i--) {
            document.getElementById(BoxToClear).options[i] = null;
        }
    }

    //Adds the loading message
    function addLoadingMessage(DropDownID) {
        document.getElementById(DropDownID).options[1] = new Option(document.getElementById(DropDownID).options[0].text, document.getElementById(DropDownID).options[0].value);
        document.getElementById(DropDownID).options[0] = new Option('Loading...', '0');
        document.getElementById(DropDownID).selectedIndex = 0;
    }

    function clearLoadingMessage(BoxToClear) {
        document.getElementById(BoxToClear).options[0] = null;
    }

    var makeID = 0;
    var modelID = 0;

	/* Ajax dropdowns */
	function populateMakes() {
	    $.post("/webservices/MakeModelData.asmx/GetCarMakes", function(data) {
	        var items = $("ListMake[@DisplayInNewCars='true']", data);
	        items.each(function() {
	            // the car must be a car and be new to qualify as contract hire                        
	            if (($(this).attr('DisplayInNewCars') == 'true')) {
	                // variable to hold the name of the car
	                var CarMake = $(this).attr('Name');

	                // create the option for the car make
	                var newOption = document.createElement('option');
	                ValueAttr = document.createAttribute('value');
	                ValueAttr.value = $(this).attr('ID');
	                newOption.setAttributeNode(ValueAttr);

	                // check to see if the current model id maches modelID
	                
	                if ($(this).attr('ID') == makeID) {
	                    // create a selected attribute
	                    SelAttr = document.createAttribute('selected');
	                    SelAttr.value = "selected";
	                    newOption.setAttributeNode(SelAttr);
	                }

	                // add the name of the car to the link
	                newOption.innerHTML = CarMake;

	                // add the option to the select class
	                $('#QuoteRequestMakeDropDown').append(newOption);
	            }
	        }
        )
	    });
	}

	/* Ajax dropdowns */
	function populateModels(makeID) {	    
	    $.post("/webservices/MakeModelData.asmx/GetCarModels", 'carMakeID=' + makeID, function(data) {
	        var items = $('Model', data);

	        document.getElementById('QuoteRequestModelsDropDown').options[0] = new Option('-- Select All Models --', '0');

	        items.each(function() {
	            //name of the car model
	            var CarModel = $(this).attr('Name');

	            // create the option for the car make
	            var newOption = document.createElement('option');
	            ValueAttr = document.createAttribute('value');
	            ValueAttr.value = $(this).attr('ID');
	            newOption.setAttributeNode(ValueAttr);

	            // check to see if the current model id maches modelID
	            
	            if ($(this).attr('ID') == modelID) {
	                // create a selected attribute
	                SelAttr = document.createAttribute('selected');
	                SelAttr.value = "selected";
	                newOption.setAttributeNode(SelAttr);
	            }

	            // add the name of the car to the link
	            newOption.innerHTML = CarModel;

	            // add the option to the select class
	            $('#QuoteRequestModelsDropDown').append(newOption);

	        }
        )
	    });
	}

	/* Ajax dropdowns */
	function populateDerivative(makeID, modelID) {
	    $.post("/webservices/MakeModelData.asmx/GetCarModels", 'carMakeID=' + makeID, function(data) {
	        var items = $('Model', data);

	        document.getElementById('QuoteRequestDerivativeDropDown').options[0] = new Option('-- Select a Derivative --', '0');
	        

	        items.each(function() {
	        if ($(this).attr('ID') == modelID) {
	                $(this).find("CapModel").find("CapDerivative").each(function() {
	                    // match up the modelID with the ID attribute

	                    //name of the car model
	                    var CarModel = $(this).attr('Name');

	                    // create the option for the car make
	                    var newOption = document.createElement('option');
	                    ValueAttr = document.createAttribute('value');
	                    ValueAttr.value = $(this).attr('ID');
	                    newOption.setAttributeNode(ValueAttr);

	                    // check to see if the current model id maches modelID
	                    if ($(this).attr('ID') == modelID) {
	                        // create a selected attribute
	                        SelAttr = document.createAttribute('selected');
	                        SelAttr.value = "selected";
	                        newOption.setAttributeNode(SelAttr);
	                    }

	                    // add the name of the car to the link
	                    newOption.innerHTML = CarModel;

	                    // add the option to the select class
	                    $('#QuoteRequestDerivativeDropDown').append(newOption);

	                });
	            }
	        }
             )
	    });
	}