zoukankan      html  css  js  c++  java
  • AJAX版三级联动(省市区)

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="sanjilandong.aspx.cs" Inherits="sanjilandong" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script src="JS/jquery-1.7.2.min.js"></script>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <select id="s1"></select>
                <select id="s2"></select>
                <select id="s3"></select>
            </div>
        </form>
    </body>
    </html>
    <script type="text/ecmascript">
        wait("1");
        function wait(a) {
            if (a == "1") {
                $.ajax({
                    url: "liandong.ashx",
                    data: { "code": "0001" },
                    type: "post",
                    dataType: "json",
                    success: function (m) {
                        $("#s1").text("");
                        for (i in m) {
                            var ss = "<option  value='" + m[i].code + "'>" + m[i].name + "</option>";
                            $("#s1").append(ss);
                        }
                    },
                    beforeSend: function () { alert('数据传输中!'); },
                    error: function () { alert('数据错误!'); },
                    complete: function () {
                        alert('数据传输完成!');
                        wait("2");
                    }
                });
            }
    
            if (a == "2") {
                $.ajax({
                    url: "liandong.ashx",
                    data: { "code": $("#s1").val() },
                    type: "post",
                    dataType: "json",
                    success: function (m) {
                        $("#s2").text("");
                        for (i in m) {
                            var ss = "<option  value='" + m[i].code + "'>" + m[i].name + "</option>";
                            $("#s2").append(ss);
                        }
                    },
                    beforeSend: function () { alert('数据传输中!'); },
                    error: function () { alert('数据错误!'); },
                    complete: function () {
                        alert('数据传输完成!');
                        wait("3");
                    }
                });
            }
    
            if (a == "3") {
                $.ajax({
                    url: "liandong.ashx",
                    data: { "code": $("#s2").val() },
                    type: "post",
                    dataType: "json",
                    success: function (m) {
                        $("#s3").text("");
                        for (i in m) {
                            var ss = "<option  value='" + m[i].code + "'>" + m[i].name + "</option>";
                            $("#s3").append(ss);
                        }
                    },
                    beforeSend: function () { alert('数据传输中!'); },
                    error: function () { alert('数据错误!'); },
                    complete: function () { alert('数据传输完成!'); }
                });
            }
        }
        $("#s1").change(function () { wait("2"); });
        $("#s2").change(function () { wait("3"); });
    </script>
            StringBuilder sb = new StringBuilder();
            sb.Append("[");
            string a = context.Request["code"];
            using (liandongDataContext con = new liandongDataContext())
            {
                int c = 0;
                List<ChinaStates> cs = con.ChinaStates.Where(r => r.ParentAreaCode == a).ToList();
                foreach (ChinaStates cc in cs)
                {
                    if (c > 0)
                    {
                        sb.Append(",{"code":"" + cc.AreaCode + "","name":"" + cc.AreaName + ""}");
                    }
                    else
                    {
                        sb.Append("{"code":"" + cc.AreaCode + "","name":"" + cc.AreaName + ""}");
                    }
                    c++;
                }
            }
            sb.Append("]");
            context.Response.Write(sb);
            context.Response.End();
  • 相关阅读:
    thinkphp分页样式css代码
    thinkphp两表,多表联合查询及分页的连贯操作写法
    ThinkPHP3.2.3新特性之:数据库设置
    ThinkPHP的主从数据库配置
    CentOS7 64位下MySQL5.7安装与配置(YUM)
    sessionid如何产生?由谁产生?保存在哪里?
    GIT使用
    Windows下安装composer
    树莓派debian配置lamp[解决Apache不显示php网页]
    【Linux】Debian 下安装 Apache,MySQL,PHP
  • 原文地址:https://www.cnblogs.com/zhangxin4477/p/6957017.html
Copyright © 2011-2022 走看看