2017-6-6 ajax 完整+三级联动

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="js/jquery-1.7.1.min.js"></script>
    <title></title>
    <style type="text/css">
        .st
         {
            width:150px;
        }


    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <select class="st" id="st1">
        <option>加载中....</option>
    </select>
        <select class="st" id="st2"><option>加载中....</option></select> 
        <select class="st" id="st3"><option>加载中....</option></select>
    </div>
    </form>
</body>
</html>
<script type="text/javascript">
    statesload('1');
    function statesload(a)
    {
        if (a == "1")
        {
            $.ajax({
                url: "ccc.ashx",
                data: { "pcode": "0001" },
                type: "post",
                dataType: "json",
                success: function (msg) {
                    $("#st1").html('');
                    for (i in msg)
                    {
                        var str = "<option value='" + msg[i].code + "'>" + msg[i].name + "</option>";
                        $("#st1").append(str);
                    }
                    statesload('2');

                },
                beforeSend: function () {
                    $("#st1").html('');
                    $("#st1").append("<option value='null'>加载中...</option>");


                }

            });

        }
        if (a == "2") {
            $.ajax({
                url: "ccc.ashx",
                data: { "pcode":$("#st1").val()},
                type: "post",
                dataType: "json",
                success: function (msg) {
                    $("#st2").html('');
                    for (i in msg) {
                        var str = "<option value='" + msg[i].code + "'>" + msg[i].name + "</option>";
                        $("#st2").append(str);
                    }
                    statesload('3');

                },
                beforeSend: function () {

                    $("#st2").html('');
                    $("#st2").append("<option value='null'>加载中...</option>");

                }

            });

        }
        if (a == "3") {
            $.ajax({
                url: "ccc.ashx",
                data: { "pcode": $("#st2").val() },
                type: "post",
                dataType: "json",
                success: function (msg) {
                    $("#st3").html('');
                    for (i in msg) {
                        var str = "<option value='" + msg[i].code + "'>" + msg[i].name + "</option>";
                        $("#st3").append(str);
                    }

                },
                beforeSend: function () {


                    $("#st3").html('');
                    $("#st3").append("<option value='null'>加载中...</option>");


                }

            });

        }
    }


    $("#st1").change(function () {

        statesload('2');

    });

    $("#st2").change(function () {

        statesload('3');

    });

</script>

<%@ WebHandler Language="C#" Class="ccc" %>

using System;
using System.Web;
using System.Linq;
using System.Collections.Generic;
using System.Text;

public class ccc : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        System.Threading.Thread.Sleep(2000);

        StringBuilder str = new StringBuilder();
        str.Append("[");
        string s=context.Request["pcode"];
        using (DataClasses2DataContext con = new DataClasses2DataContext())
        {
            int count = 0;
            List<ChinaStates> clist = con.ChinaStates.Where(r => r.ParentAreaCode == s).ToList();
            foreach(ChinaStates c in clist)
            {
                if (count > 0) str.Append(",");
                str.Append("{\"code\":\""+c.AreaCode+"\",\"name\":\""+c.AreaName+"\"}");
                count++;
            }
        }

        str.Append("]");
        context.Response.Write(str);
        context.Response.End();
    }
 
    public bool IsReusable {
        get {
            return false;
        }
    }

}

posted on 2017-06-07 09:54 口袋里的SKY 阅读(257) 评论(1) 编辑收藏举报