JSFiddle - React, Tailwind, and code Playground

by revathskumar

HTML

<script src="http://jquery-json.googlecode.com/files/jquery.json-2.2.min.js"></script>
<div>
    <select id="sel_dept">
        <option value="1">A</option>
        <option value="2">B</option>
        <option value="3">C</option>
    </select>
    <select id="sel_user">

    </select>    
</div>

JavaScript

// fill combo box with json
var data = {
    json:$.toJSON({
        1:{
            1:"A",
            2: "AA",
            3:"AAA"
        },
        2:{
            4:"B",
            5:"BB",
            6:"BBB"
        },
        3:{
            7:"C",
            8:"CC",
            9:"CCC"
        }
    })
}

jQuery(function($){
    $("#sel_dept").change(function(){
        a = $(this).val()
        $.ajax({
            url:"/echo/json/",
            data:data,
            type:"POST",
            success:function(response)
            {
                user = $("#sel_user");
                user.empty();
                $.each(response[a], function(id,value){
                    var opt = document.createElement("option");
                    $(opt).val(id).html(value);
                    user.append(opt);
                });
            }
        });    
    });        
    
})