Lydia Lydia - 1 year ago 133
jQuery Question

How to populate dependable drop-down using Ajax and php

Hi i want to manage data on drop-down menu using Ajax.

Databse Fields:



<select id="id"></select>
<select id="name"></select>
<select id="department"></select>

1.If i selected one drop-down menu want to change another drop-downs depend on selected value using Ajax.

2.Is there any code available, if i select one drop-down it go to another child window and display data as in table format(like report) using Ajax.

Thanks in Advance.

Please give me example code, because i am beginner to ajax , most welcome if someone provide explanation with code(for ajax).

Answer Source

Yes, You have need to following jquery ajax code. In the below example, If you are change department then it will populate the listing of name dropdown.

$(document).on("change", '#department', function(e) {
            var department = $(this).val();

                type: "POST",
                data: {department: department},
                url: 'admin/users/get_name_list.php',
                dataType: 'json',
                success: function(json) {

                    var $el = $("#name");
                    $el.empty(); // remove old options
                            .attr("value", '').text('Please Select'));
                    $.each(json, function(value, key) {
                                .attr("value", value).text(key));



Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download