jQuery ajax 多级联动 下拉框 Demo

博文地址 http://www.cnblogs.com/cl-blogs/p/4708102.html?utm_source=tuicool&utm_medium=referral ajax 实现 (全国,省,是,区....) N级联 Demo js: $(function () { $.fn.CascadeSelect({ url: '/CascadeSelect/CascadeSelect.ashx', //返回Json数据的一般处理文件 idKey: 'Id', // 绑定下拉框实际值的字段 nameKey: 'Name', // 绑定下拉框显示值的字段 casTopId: 0, // 顶级节点ParentId casCount: 4, // 级联个数 casObjId: ['SelProvince', 'SelCity', 'SelArea', 'SelXian'], // 级联下拉框id casDefVal: ['全国', 5, '益阳', 22], // 级联默认值(Id,Name都可以) }); }); html： 省级联动 ashx: 接收参数 Level 级联级别 从1开始 ParentID 父级ID

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Newtonsoft.Json;

namespace CascadeSelect.CascadeSelect
{
    /// 

    /// CascadeSelect 的摘要说明
    /// 

    public class CascadeSelect : IHttpHandler
    {

        public void ProcessRequest（HttpContext context）
        {
            context.Response.ContentType = “text/plain“;
            List list = new List（）;

            list.Add（new CascadeModel（） { Id = 1 Name = “全国“ PId = 0 }）;
            list.Add（new CascadeModel（） { Id = 25 Name = “海外“ PId = 0 }）;

            list.Add（new CascadeModel（） { Id = 2 Name = “河北“ PId = 1 }）;
            list.Add（new CascadeModel（） { Id = 3 Name = “河南“ PId = 1 }）;
            list.Add（new CascadeModel（） { Id = 4 Name = “湖北“ PId = 1 }）;
            list.Add（new CascadeModel（） { Id = 5 Name = “湖南“ PId = 1 }）;

            list.Add（new CascadeModel（） { Id = 6 Name = “河北-市xx“ PId = 2 }）;
            list.Add（new CascadeModel（） { Id = 7 Name = “河北-市oo“ PId = 2 }）;
            list.Add（new CascadeModel（） { Id = 8 Name = “河南-市xx“ PId = 3 }）;
            list.Add（new CascadeModel（） { Id = 9 Name = “河南-市oo“ PId = 3 }）;
            list.Add（new CascadeModel（） { Id = 10 Name = “湖北-市xx“ PId = 4 }）;
            list.Add（new CascadeModel（） { Id = 11 Name = “湖北-市oo“ PId = 4 }）;
            list.Add（new CascadeModel（） { Id = 12 Name = “长沙“ PId = 5 }）;
            list.Add（new CascadeModel（） { Id = 13 Name = “益阳“ PId = 5 }）;


            list.Add（new CascadeModel（） { Id = 14 Name = “河北-市xx县xx“ PId = 6 }）;
            list.Add（new CascadeModel（） { Id = 15 Name = “河北-市xx县xx“ PId = 6 }）;
            list.Add（new CascadeModel（） { Id = 16 Name = “河北-市xx县xx“ PId = 6 }）;
            list.Add（new CascadeModel（） { Id = 17 Name = “河北-市xx县xx“ PId = 6 }）;

            list.Add（new CascadeModel（） { Id = 18 Name = “河北-市oo-县oo“ PId = 7 }）;
            list.Add（new CascadeModel（） { Id = 19 Name = “河北-市oo-县oo“ PId = 7 }）;
            list.Add（new CascadeModel（） { Id = 20 Name = “河北-市oo-县oo“ PId = 7 }）;
            list.Add（new CascadeModel（） { Id = 21 Name = “河北-市oo-县oo“ PId = 7 }）;

            list.Add（new CascadeModel（） { Id = 22 Name = “益阳-资阳区“ PId = 13 }）;
            list.Add（new CascadeModel（） { Id = 23 Name = “益阳-赫山区“ PId = 13 }）;
            list.Add（new CascadeModel（） { Id = 24 Name = “益阳-桃江县“ PId = 13 }）;


            int prentId = Convert.ToInt32（context.Request.Form[“ParentID“]）;
            List newList = list.Where（t => t.PId == prentId）.ToList（）;
            string resultStr = JsonConvert.Serializeobject（newList）;
            context.Response.Write（resultStr）;
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }


    public class CascadeModel

 属性            大小     日期    时间   名称
----------- ---------  ---------- -----  ----

     文件       7168  2015-08-06 14:16  CascadeSelect\CascadeSelect\bin\CascadeSelect.dll

     文件      13824  2015-08-06 14:16  CascadeSelect\CascadeSelect\bin\CascadeSelect.pdb

     文件     374784  2015-08-06 12:18  CascadeSelect\CascadeSelect\bin\newtonsoft.json.dll

     文件        121  2015-08-06 12:27  CascadeSelect\CascadeSelect\CascadeSelect\CascadeSelect.ashx

     文件       3309  2015-08-06 12:28  CascadeSelect\CascadeSelect\CascadeSelect\CascadeSelect.ashx.cs

     文件      93637  2015-08-06 12:22  CascadeSelect\CascadeSelect\CascadeSelect\jquery-1.8.3.min.js

     文件       4986  2015-08-06 15:05  CascadeSelect\CascadeSelect\CascadeSelect\jquery.cascadeselect.js

     文件       4644  2015-08-06 12:27  CascadeSelect\CascadeSelect\CascadeSelect.csproj

     文件       1085  2015-08-06 12:27  CascadeSelect\CascadeSelect\CascadeSelect.csproj.user

     文件       2184  2015-08-06 14:12  CascadeSelect\CascadeSelect\index.html

     文件     374784  2015-08-06 12:18  CascadeSelect\CascadeSelect\lib\newtonsoft.json.dll

     文件        369  2015-08-06 14:16  CascadeSelect\CascadeSelect\obj\Debug\CascadeSelect.csproj.FileListAbsolute.txt

     文件       7168  2015-08-06 14:16  CascadeSelect\CascadeSelect\obj\Debug\CascadeSelect.dll

     文件      13824  2015-08-06 14:16  CascadeSelect\CascadeSelect\obj\Debug\CascadeSelect.pdb

     文件       7283  2015-08-06 14:16  CascadeSelect\CascadeSelect\obj\Debug\DesignTimeResolveAssemblyReferencesInput.cache

     文件       1327  2015-08-06 12:18  CascadeSelect\CascadeSelect\Properties\AssemblyInfo.cs

     文件        313  2015-08-06 12:18  CascadeSelect\CascadeSelect\Web.config

     文件       1240  2015-08-06 12:18  CascadeSelect\CascadeSelect\Web.Debug.config

     文件       1301  2015-08-06 12:18  CascadeSelect\CascadeSelect\Web.Release.config

     文件        929  2015-08-06 12:19  CascadeSelect\CascadeSelect.sln

    ..A..H.     11264  2015-08-06 12:27  CascadeSelect\CascadeSelect.suo

     目录          0  2015-08-06 12:18  CascadeSelect\CascadeSelect\obj\Debug\TempPE

     目录          0  2015-08-06 14:16  CascadeSelect\CascadeSelect\obj\Debug

     目录          0  2015-08-06 14:16  CascadeSelect\CascadeSelect\bin

     目录          0  2015-08-06 12:27  CascadeSelect\CascadeSelect\CascadeSelect

     目录          0  2015-08-06 12:18  CascadeSelect\CascadeSelect\lib

     目录          0  2015-08-06 12:18  CascadeSelect\CascadeSelect\obj

     目录          0  2015-08-06 12:18  CascadeSelect\CascadeSelect\Properties

     目录          0  2015-08-06 12:27  CascadeSelect\CascadeSelect

     目录          0  2015-08-06 12:18  CascadeSelect

............此处省略3个文件信息