change options in form based on selection.

[240coda]

I'd like to try an replicate the new and used car form from cars.com Could anyone point me in the right direction for making a form that will load different <option> depending on the previously selected option. Here is a sample of the json data from cars.com

ddData = {
    "USED": [{
        "name": "Acura",
        "value": "20001",
        "models": [{
            "name": "CL",
            "value": "20773"
        }, {
            "name": "ILX",
            "value": "47843"
        }, {
            "name": "ILX Hybrid",
            "value": "48964"
        }, {
            "name": "Integra",
            "value": "21266"
        }, {
            "name": "Legend",
            "value": "21380"
        }, {
            "name": "MDX",
            "value": "21422"
        }, {
            "name": "NSX",
            "value": "21685"
        }, {
            "name": "RDX",
            "value": "21831"
        }, {
            "name": "RL",
            "value": "21782"
        }, {
            "name": "RSX",
            "value": "21784"
        }, {
            "name": "SLX",
            "value": "21879"
        }, {
            "name": "TL",
            "value": "22237"
        }, {
            "name": "TSX",
            "value": "22248"
        }, {
            "name": "Vigor",
            "value": "22362"
        }, {
            "name": "ZDX",
            "value": "32888"
        }]
    }, {
        "name": "Alfa Romeo",
        "value": "20047",
        "models": [{
            "name": "164",
            "value": "20325"
        }, {
            "name": "8c Competizione",
            "value": "34963"
        }, {
            "name": "Spider",
            "value": "22172"
        }]
    }, {
        "name": "Am General",
        "value": "20002",
        "models": [{
            "name": "Hummer",
            "value": "21235"
        }]
    }, {
        "name": "Aston Martin",
        "value": "20003",
        "models": [{
            "name": "DB AR1 Zagato",
            "value": "46643"
        }, {
            "name": "DB7",
            "value": "20961"
        }, {
            "name": "DB7 Vantage",
            "value": "20955"
        }, {
            "name": "DB9",
            "value": "20967"
        }, {
            "name": "DBS",
            "value": "20957"
        }, {
            "name": "Rapide",
            "value": "37363"
        }, {
            "name": "V12 Vanquish",
            "value": "22247"
        }, {
            "name": "V12 Vantage",
            "value": "40743"
        }, {
            "name": "V8 Vantage",
            "value": "22253"
        }, {
            "name": "V8 Vantage S",
            "value": "47110"
        }, {
            "name": "Vantage",
            "value": "22266"
        }, {
            "name": "Virage",
            "value": "22282"
        }]
    }]
}

[sunfighter]

These are called Dynamic Dropdowns and google will bring up a number of sites for you. But try these for starters:
http://javascript.about.com/library/bldydrop1.htm
And
http://javascript.about.com/library/bl3drop.htm

[d'Anconia]

Yeah I don't think you will need Ajax, just regular Javascript on this one.

Just create a conditional that deletes the 2nd pull-down menu and replaces it with a different one based on the selection of the first pull-down menu. I think "onchange" would be the event listener for the original drop-down menu.

I hope this helps, I don't have to time to go too far into it right now.