地区的三级联动

首先在aspx界面中拖入三个DropDownList控件,分别右键属性前两个控件,把 AutoPostBack 改为 True ,Items点击添加在txt中输入请选择,并把Value的值改为0,再点击事件按钮把前两个控件添加SelectedIndexChanged事件。

数据库的设计,列名有 id(自增长)  ParentId   Name,如图

进入cs界面,在Page_Load中写如下代码

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            getProdata();//省(直辖市)
            getcitydata();//市
            getquxiandata();//县
        }
    }

然后在前两个DropDownList控件下写SelectedIndexChanged事件,代码如下

 protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        getcitydata();//市
        getquxiandata();//县
    }
    protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
    {
        getquxiandata();//县
    }

再写 getProdata();//省(直辖市) getcitydata();//市 getquxiandata();//县      方法的代码

 public void getProdata()//省、直辖市
    {
        var query = dc.dt.Where(p => p.ParentId == 0);
        if (query.Count() !=0)
        {
            DropDownList1.DataSource = query;//绑定数据之前先清除之前数据
            DropDownList1.DataTextField = "Name";
            DropDownList1.DataValueField = "id";
            DropDownList1.DataBind();
        }
        else
        {
            DropDownList1.Text = "无数据";
        }
    }
    public void getcitydata()//市
    {
        string name1 = DropDownList1.SelectedValue;//获取选中值的ID

        var query = dc.dt.Where(p => p.ParentId == int.Parse(name1));
        if (query.Count() != 0)
        {
            DropDownList2.DataSource = query;
            DropDownList2.DataTextField = "Name";
            DropDownList2.DataValueField = "id";
            DropDownList2.DataBind();
        }
        else
        {
            DropDownList2.SelectedIndex  = 0;
        }
    }

    public void getquxiandata()//县
    {
        string name2 = DropDownList2.SelectedValue;//获取选中值的ID

            var query = dc.dt.Where(p => p.ParentId == int.Parse(name2));
            if (query.Count() != 0)
            {
                DropDownList3.DataSource = query;
                DropDownList3.DataTextField = "Name";
                DropDownList3.DataValueField = "id";
                DropDownList3.DataBind();
            }
            else
            {
                DropDownList3.SelectedIndex = 0;
            }
    }

完成

时间: 2024-11-02 11:42:33

地区的三级联动的相关文章

地区选择-三级联动

1. city_pickers: ^0.0.1 import 'package:city_pickers/city_pickers.dart'; 2. class TabsPage extends StatefulWidget{ @override _TabsPageState createState() => new _TabsPageState(); } class _TabsPageState extends State<TabsPage> with SingleTickerPro

地区选择三级联动

html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="area.js"></script> </head> <body> <select name="&quo

20150303--从SQL中获取数据的三级联动

省市地区的三级联动,每变更一次所选地都需要提交,但是又不需要把整个页面提交,所以我们需要使用控件:UdataPanel.工具--AJAX扩展 还有ScriptManager,并要将其放在页面的最顶端. DropDownList则需要放在UpdatePanel中: HTML源: <body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="S

AJAX+PHP实现三级联动

利用ajax实现页面地区选择三级联动 效果图如下 当选择相应省份时,对应显示出所有相关城市和地区的下拉选择 来看下如何实现的 html页面部分 <!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.

中国地区三级联动菜单(纯js制作)

第一步:在网页中写入如下代码: <!DOCTYPE html> <!--次行代表使用的是html5,如果不支持请换成html4--> <html> <head> <title>三级联动菜单</title><br> <script src="style/jsAddress.js"></script> <!--需要和js文件在同一目录下--> </head>

(转)JavaScript html js 地区二级联动,省市二级联动,省市县js+xml三级联动

JavaScript html js 地区二级联动,省市二级联动,省市县js+xml三级联动 原文链接:http://heisetoufa.iteye.com/blog/353974 比较好的二级联动: 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 2 <HTML> 3 <HEAD> 4 <TITLE> New Document </TITLE>

地区三级联动--省份province

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>地区三级联动</title> <script src="./jquery.js"></script> </head> <body> <h2>地区三级联动</h2> 省

全国地区选择(三级联动)

1.新建HTML文件,引入必须的js文件. <script src="../js/jquery.min.js"></script> //自行引入 <script src="../js/Area.js"></script> <script src="../js/AreaData_min.js"></script> Area.js: 1 // 地址选择三级联动 2 $(funct

用DropDownList实现的省市级三级联动

这是一个用DropDownList 实现的省市级三级联动,记录一下········ <asp:ScriptManager ID="ScriptManager1" runat="server">/asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server">                          <Cont