Dynamic dropdown

Question

I have two dropdowns in my site. I want to change the number of options and the values of options of one dropdown depending on the value we choosing on the other dropbox by

Answer 1

Try this.

HTML

<select name="language" id="language" onchange="SetMedia(this)">
    <option>select</option>
    <option >English</option>
    <option>Tamil</option>
    <option>Telugu</option>
</select>

<select name="media" id="media" disabled="disabled">
    <option>select</option>
</select>

JavaScript

function SetMedia(objLanguage) {
    var objMedia = document.getElementById("media");
    objMedia.options.length = 0;
        objMedia.disabled = false;
    switch (objLanguage.value) {
    case "English":
        objMedia.options.add(new Option("The Indian Express"));
        objMedia.options.add(new Option("The Hindu"));
        break;
    case "Tamil":
        objMedia.options.add(new Option("Tamil Paper 1"));
        objMedia.options.add(new Option("Tamil Paper 2"));
        break;
    case "Telugu":
        objMedia.options.add(new Option("Telugu Paper 1"));
        objMedia.options.add(new Option("Telugu Paper 2"));
        break;
    default:
        objMedia.options.add(new Option("select"));
        objMedia.disabled = true;
        break;
    }
}

Demo here: http://jsfiddle.net/naveen/z48dc/

Answer 2

If you have to do this just plain javascript than you can do this.Which will result in little dirty approach .

http://www.felgall.com/jstip22.htm

I would suggest to do this using JQUERY and AJAX . Send a AJAX request to get the second dropdown data . Check this sample

http://www.99points.info/2010/06/ajax-tutorial-dynamic-loading-of-combobox-using-jquery-and-ajax-in-php/

http://demos.99points.info/dynamic_dropdown/