无刷新省级三级联动（ajax）

前台代码

<%@ Page Language="C#" AutoEventWireup="true"  CodeBehind="无刷新省市县三联动.aspx.cs" Inherits="无刷新省市三联动.无刷新省市县三联动" %>


< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html xmlns="http://www.w3.org/1999/xhtml">
< head runat="server">
    <title></title>
    <script src="js/Jquery1.7.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $.ajax({
                type: "post",
                contentType: "application/json",
                url: "Web省市县.asmx/Getsheng",
                data: "{}",
                success: function (result) {
                    var stroption = null;
                    for (var i = 1; i <= result.d.length; i++) {
                        stroption = '<option value=' + result.d[i][0] + '>';
                        stroption += result.d[i][1];
                        stroption += '</option>';
                        $('#ddlsheng').append(stroption);
                    }
                },
                error: function () {
                    alert('加载失败');
                }
            });
            $('#ddlsheng').change(function () {
                //alert($(this).val());
                $('#ddlshi option:gt(0)').remove();
                $.ajax({
                    type: 'post',
                    contentType: 'application/json',
                    url: 'Web省市县.asmx/Getshi',
                    data: "{provinceid:'" + $(this).val() + "'}",
                    success: function (result) {
                        var strshi = null;
                        for (var i = 1; i <= result.d.length; i++) {
                            strshi = '<option value=' + result.d[i][0] + '>';
                            strshi += result.d[i][1];
                            strshi += '</option>';
                            $('#ddlshi').append(strshi);
                        }
                    },
                    error: function () { alert('加载失败') }
                })
            });


            $('#ddlshi').change(function () {
                $('#ddlxian option:gt(0)').remove();
                $.ajax({
                    type: "post",
                    contentType: "application/json",
                    url: "Web省市县.asmx/Getxian",
                    data: "{cityid:'" + $(this).val() + "'}",
                    success: function (result) {
                        var strxian = null;
                        for (var i = 0; i < result.d.length; i++) {
                            strxian = '<option value=' + result.d[i][0] + '>';
                            strxian += result.d[i][1];
                            strxian += '</option>';
                            $('#ddlxian').append(strxian);
                        }
                    },
                    error: function () { alert('加载失败') }
                })
            })
        })


    </script>
< /head>
< body>
    <form id="form1" runat="server">
    <div>
        省:<select id="ddlsheng"><option>----请选择----</option></select>
        市:<select id="ddlshi"><option>--请选择--</option></select>
        县:<select id="ddlxian"><option>--请选择--</option></select>
    </div>
   
    </form>
< /body>
< /html>

WebService页面代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Configuration;
using System.Data.SqlClient;
using System.Data;


namespace 无刷新省市三联动
{
    /// <summary>
    /// Web省市县 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
    [System.Web.Script.Services.ScriptService]
    public class Web省市县 : System.Web.Services.WebService
    {


        [WebMethod]
        public string HelloWorld()
        {
            return "Hello World";
        }
        [WebMethod]
        //加载省
        public List<string[]> Getsheng()
        {
            List<string[]> list = new List<string[]>();
            string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
            SqlConnection conn = new SqlConnection(constr);
            SqlCommand cmd =conn.CreateCommand();
            conn.Open();
            cmd.CommandText = "Pro_province";
            cmd.CommandType = CommandType.StoredProcedure;
            SqlDataAdapter adapter = new SqlDataAdapter(cmd);
            DataTable dt = new DataTable();
            adapter.Fill(dt);
            cmd.Dispose();
            conn.Dispose();
            foreach (DataRow item in dt.Rows)
            {
                string[] arraysheng = new string[2];
                arraysheng[0] = item[1].ToString();
                arraysheng[1] = item[2].ToString();
                list.Add(arraysheng);
            }
            return list;
        }
        //加载市
        [WebMethod]
        public List<string[]> Getshi(string provinceid)
        {
            //string provinceid = "";
            List<string[]> list = new List<string[]>();
            string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
            SqlConnection conn = new SqlConnection(constr);
            SqlCommand cmd = conn.CreateCommand();
            conn.Open();
            cmd.CommandText = "Pro_city";
           
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.AddWithValue("@fatherid", provinceid);
            SqlDataAdapter adapter = new SqlDataAdapter(cmd);
            DataTable dt = new DataTable();
            adapter.Fill(dt);
            cmd.Dispose();
            conn.Dispose();
            foreach (DataRow item in dt.Rows)
            {
                string[] arrayshi = new string[2];
                arrayshi[0] = item[0].ToString();
                arrayshi[1] = item[1].ToString();
                list.Add(arrayshi);
            }
            return list;
        }
        //加载县
        [WebMethod]
        public List<string[]> Getxian(string cityid)
        {
            List<string[]> list = new List<string[]>();
            string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
            SqlConnection conn = new SqlConnection(constr);
            SqlCommand cmd = conn.CreateCommand();
            conn.Open();
            cmd.CommandText = "pro_area";
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.AddWithValue("@cityid", cityid);
            SqlDataAdapter adapter = new SqlDataAdapter(cmd);
            DataTable dt = new DataTable();
            adapter.Fill(dt);
            cmd.Dispose();
            conn.Dispose();
            foreach (DataRow item in dt.Rows)
            {
                string[] arrayxian = new string[2];
                arrayxian[0] = item[0].ToString();
                arrayxian[1] = item[1].ToString();
                list.Add(arrayxian);
            }
            return list;
        }
    }
}

数据库存储过程代码

create proc Pro_province//建立省的存储过程
as
select * from province
go
exec Pro_province//执行存储过程

drop proc Pro_area//删除存储过程

create proc pro_city //建立市的存储过程
@fatherid varchar(10)
as
select cityID,city from city where father=@fatherid;
GO

create proc pro_area  //建立县的存储过程
@cityid varchar(10)
as
select areaID,area from area where father=@cityid;
GO