Jquery Json 下拉联动

 #region dataTable转换成Json格式

        /// <summary>  

        /// dataTable转换成Json格式  

        /// </summary>  

        /// <param name="dt"></param>  

        /// <returns></returns>  

        public static string DataTable2Json(DataTable dt)

        {

            StringBuilder jsonBuilder = new StringBuilder();

            jsonBuilder.Append("{\"dept");

            jsonBuilder.Append(dt.TableName);

            jsonBuilder.Append("\":[");

            jsonBuilder.Append("[");

            for (int i = 0; i < dt.Rows.Count; i++)

            {

                jsonBuilder.Append("{");

                for (int j = 0; j < dt.Columns.Count; j++)

                {

                    jsonBuilder.Append("\"");

                    jsonBuilder.Append(dt.Columns[j].ColumnName);

                    jsonBuilder.Append("\":\"");

                    jsonBuilder.Append(dt.Rows[i][j].ToString());

                    jsonBuilder.Append("\",");

                }

                jsonBuilder.Remove(jsonBuilder.Length - 1, 1);

                jsonBuilder.Append("},");

            }

            jsonBuilder.Remove(jsonBuilder.Length - 1, 1);

            jsonBuilder.Append("]");

            jsonBuilder.Append("]");

            jsonBuilder.Append("}");

            return jsonBuilder.ToString();

        }



        #endregion dataTable转换成Json格式

　　前台  

HTML代码

<lable>院区选择：</lable>
<input class="yq" type="radio" name="hospital" id="radio" value="0" checked="checked"><label for="radio">西院</label>
<input class="yq" type="radio" name="hospital" id="radio2" value="2"><label for="radio2">东院</label>

<select style="width: 100px;" id="deptCode" name="deptCode">
<option value="">全部科室</option>
</select>
<select style="width: 100px;" id="docCode" name="docCode">
<option value="">全部医生</option>
</select>

    $(function () {

//此处我放的是 radio 的选中事件

 $("input[name=hospital]").click(function () {

          

            //获取radio 选中的值

            var hospital = $("input[name='hospital']:checked").val();



            $.post("@Url.Action("GetDeptByHospital", "PatientBooking")", { hospital: hospital }, function (data) {

                //将返回的json eval（）

                var jsonList = eval("(" + data + ")");

           

                $.each(jsonList.dept, function (index, b) {

                    

                    for (var i = 0; i < b.length; i++) {

//将值循环添加到 下拉列表中    -------  deptCode=下拉列表的ID

                        $("#deptCode").append('<option value=' + b[i].dept_code + '>' + b[i].dept_name + '</option>');

                     

                    }

                })



            });

        });

    });

    下拉联动效果代码

 $('#deptCode').change(function () {

        var hospital = $("input[name='hospital']:checked").val();

        var DeptCode = $("#deptCode").val();

        $.post("@Url.Action("YY08GetDeptMedicalByHospitalAndDeptCode", "PatientBooking")", { hospital: hospital,deptCode:DeptCode }, function (data) {

          

            var jsonList = eval("(" + data + ")");



            $.each(jsonList.dept, function (index, b) {

            

                for (var i = 0; i < b.length; i++) {

//  expert_id，expert_name = json 定义的字段   

                    $("#docCode").append('<option value=' + b[i].expert_id + '>' + b[i].expert_name + '</option>');



                }

            })



        });

    });