X级联动

前端数据

@{
    ViewBag.Title = "Index";
}
<script src="~/Scripts/jquery-1.10.2.js"></script>
<h2>部门</h2>
<select id="Select1">
    <option value=">请选择</option>
</select>
<select id="Select2">
    <option value=">请选择</option>
</select>
<select id="Select3">
    <option value=">请选择</option>
</select>
<script type="text/javascript">
    $(function () {
        BindNextSel();
        $("#Select1").change(function () {
            debugger
            var id = $(this).val();
            ) {
                $("#Select2 option:not(:first)").remove();
                $("#Select3 option:not(:first)").remove();
                BindNextSel("Select2", id);
            }
        });
        $("#Select2").change(function () {
            debugger
            var id = $(this).val();
            ) {
                $("#Select3 option:not(:first)").remove();
                BindNextSel("Select3", id);
            }
        });
    });
    function BindNextSel(selID, id) {
        $.ajax({
            url: "/Default/Indexs",
            data: { pid: id },
            dataType: "json",
            type: "get",
            success: function (data) {
                debugger
                if (data) {
                    $("#" + selID + " option:not(:first)").remove();
                    ; i < data.length; i++) {
                        $("#" + selID).append("<option value='" + data[i].Id + "'>" + data[i].Mention + "</option>");
                    }
                }
            }
        });
    }
</script>

后台数据

 )
        {
            var list = XialaDals.GetList(pid);
            return JsonConvert.SerializeObject(list);
        }