Binding two dropdown list dynamically

[bskapoor11407]

I am trying to bind the another dropdown list on selected item of dropdown 1. Please give me code, if some one has.

Dropwdown 1:

     <select id="lst_consultantcontact" name="lst_consultantcontact" onchange="GetConsultantContactInfo()" >
     <option >.....</option>
     </select>

** Javascript Code:**

      <script language="javascript">
                                    function GetConsultantContactInfo() {
                                        var ConsultantId = document.getElementById('lst_consultantcontact').options[document.getElementById('lst_consultantcontact').selectedIndex].value;
                                        var hiddenfield = document.getElementById('hidden1');
                                        hiddenfield.value = ConsultantId;

                                    }

                                </script>

Drop Down List 2:

    <select id="lst_consultantcontact2" name="lst_consultantcontact2" >
     <option>..</option</select>




 I want to bind this dropdown list

[wesley.cheng]

html:

<select id="one"></select>
<select id="two"></select>

javascript:

var one = ['A', 'B', 'C'];
var two = [['A 1', 'A 2'],['B 1', 'B 2', 'B 3'], ['C 1', 'C 2']];

function getOptions(options) {
    var html = '';
    for (index in options) {
         html += '<option>' + options[index] + '</option>'
    }
    return html;
}

document.getElementById('one').addEventListener('change', function() {
    var index = this.selectedIndex;
    document.getElementById('two').innerHTML = getOptions(two[index]);
});

document.getElementById('one').innerHTML = getOptions(one);
document.getElementById('two').innerHTML = getOptions(two[0]);

[bskapoor11407]

Actually, dropdown values are coming from database. And I am using Classic asp.

[wesley.cheng]

Yeah, only a reference, or you can use ajax to get dropdown2 values by dropdown1 selected value

[khong.coai.526]

 <script type="text/javascript">
        $(function () {
            $('select#dropdown1').change(function () {
                var Id = $(this).val();// has paramenter 
                $.ajax({
                    url: 'LoadDaTa', //call function LoadData
                    type: 'POST',
                    data: JSON.stringify({ Id: Id }), //has paramenter 
                    dataType: 'json',
                    contentType: 'application/json',
                    success: function (data) {
                        $.each(data, function (key, a) {
                            // deleted item in dropdownlist 2
                            var select = $("select#dropdown2");
                            select.children().remove();
                            select.append('<option value="">---chose item---</option>');
                            // loop add item in dropdownlist 2
                            $.each(data, function (index, a) {
                                select.append('<option value="' + a.Datavaluefield + '">' + a.Datatextfield + '</option>');
                            });
                        });
                    }
                });
            });
        });
    </script>