JQuery Dynamic Combobox

Why within JQuery开发者_如何学运维, the combobox add method doesn't seem to be recognized as with traditional html combobox here:

http://viralpatel.net/blogs/demo/dynamic-combobox-listbox-dropdown-in-javascript.html

To get the actual DOM element in jQuery to call DOM methods on, use .get():

$("#myDropDown").get(0).add(option);

Please note though, there's another way to do this in jQuery:

$('#myDropDown').append($('<option></option>').val(myVal).html(optionText));

There's also the Select Box plugin if you're doing a lot more with selects.

function MyFunction(myOption)
{
   $("#cbx").attr("innerHTML",myOption);
}

myOption should look something like this:

var myOption = "<option>" + whatever you want + "</option>";

I would ussually create my own Methods so I can Simply call e.g AddDoc(doc);
Even $("#myDropDown").get(0).add(option); feels too long for me.
Id do something like InsertOption(cbx,Option);
This is just an alternative way ^^.

function InsertOption(cbx,option)
{
   $("#"+cbx).attr("innerHTML",option);
}

function AppendOption(cbx,option)
{
   var opt = $("#"+cbx).attr("innerHTML");
   opt += option;
   $("#"+cbx).attr("innerHTML",opt);
}

Sorry if I made any mistakes ^^... junior prog ere :D

If suppose we have 2 combo boxes

1. state
2. cities

When you select the state combo box then according to that value it will add items into cities combo box:

 $(document).ready(function () {

        $("#DropDownList1").change(function () {

            if ($("#DropDownList1 option:selected").text() == "Please Select") {
                $("select[id$=DropDownList2] > option").remove();
            }

            if ($("#DropDownList1 option:selected").text() == "Andhra Pradesh") {
                $("select[id$=DropDownList2] > option").remove();
                $("#DropDownList2").append($("<option>" + ("Hyderabad") + "</option>"));
                $("#DropDownList2").append($("<option>" + ("Vijayawada") + "</option>"));
                $("#DropDownList2").append($("<option>" + ("Karimnagar") + "</option>"));
            }
            if ($("#DropDownList1 option:selected").text() == "Tamilnadu") {
                $("select[id$=DropDownList2] > option").remove();
                $("#DropDownList2").append($("<option>" + ("Madhurai") + "</option>"));
                $("#DropDownList2").append($("<option>" + ("Chennai") + "</option>"));
            }
            if ($("#DropDownList1 option:selected").text() == "Karnataka") {
                $("select[id$=DropDownList2] > option").remove();
                $("#DropDownList2").append($("<option>" + ("Bangalore") + "</option>"));
            }

        });
    });