三级联动下拉菜单

写个CS,
AJAX也可以using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
/// <summary>
/// provcityservstat 的摘要说明
/// 这个类主要是用来当省/城市/服务站都是下拉进判断,省和城市教师都是autopostback
/// </summary>
public class provcityservstat
{
    public DropDownList prov;
    public DropDownList city;
    public DropDownList servstat;
    public string servstat_id;
public provcityservstat()
{
//
// TODO: 在此处添加构造函数逻辑
//
}
    //绑定省的下拉
    public void dataBindToProv()
    {
        SqlConnection con = db.createSqlConneciton();
        con.Open();
        SqlCommand cmd = new SqlCommand("select * from t_prov", con);
        SqlDataReader sdr = cmd.ExecuteReader();
        this.prov.DataSource = sdr;
        this.prov.DataTextField = "prov_name";
        this.prov.DataValueField = "prov_id";
        this.prov.DataBind();
        sdr.Close();
        con.Close();
    }

    //绑定城市下拉
    public void dataBindToCity()
    {
        SqlConnection con = db.createSqlConneciton();
        con.Open();
        SqlCommand cmd = new SqlCommand("select * from t_city where city_provid = " + this.prov.SelectedValue, con);
        SqlDataReader sdr = cmd.ExecuteReader();
        this.city.DataSource = sdr;
        this.city.DataTextField = "city_name";
        this.city.DataValueField = "city_id";
        this.city.DataBind();
        sdr.Close();
        con.Close();
    }

    //绑定服务站
    public void dataBindToServstat()
    {
        if (this.city.SelectedValue != "")
        {
            SqlConnection con = db.createSqlConneciton();
            con.Open();
            SqlCommand cmd = new SqlCommand("select * from t_servstat where servstat_cityid = " + this.city.SelectedValue, con);
            SqlDataReader sdr = cmd.ExecuteReader();
            this.servstat.DataSource = sdr;
            this.servstat.DataTextField = "servstat_name";
            this.servstat.DataValueField = "servstat_id";
            this.servstat.DataBind();
            sdr.Close();
            con.Close();
        }
        else
        {
            this.servstat.Items.Clear();
        }
    }

    //一般用于新增时省,城市,服务站的下拉
    public void dataBindAdd()
    {
        dataBindToProv();
        dataBindToCity();
        dataBindToServstat();
    }

    //当省的下拉发生变化时
    public void databinddropdownprov()
    {
        dataBindToCity();
        dataBindToServstat();
    }

    //下面开始是用于修改的,根据已知的servstat_id得出是哪个服务站,哪个城市,哪个省
    public void dataBindMod()
    {
        SqlConnection con = db.createSqlConneciton();
        con.Open();
        SqlCommand cmd = new SqlCommand("select * from t_servstat,t_city,t_prov where prov_id = city_provid and city_id = servstat_cityid and servstat_id = " + servstat_id, con);
        SqlDataReader sdr = cmd.ExecuteReader();
        if (sdr.Read())
        {
            dataBindModProv(sdr["prov_id"].ToString());
            dataBindModCity(sdr["prov_id"].ToString(), sdr["city_id"].ToString());
            dataBindModServstat(sdr["city_id"].ToString(), sdr["servstat_id"].ToString());
        }
        sdr.Close();
        con.Close();
    }

    //绑定到修改时的省
    public void dataBindModProv(string prov_id)
    {
        SqlConnection con = db.createSqlConneciton();
        con.Open();
        SqlCommand cmd = new SqlCommand("select * from t_prov", con);
        SqlDataReader sdr = cmd.ExecuteReader();
        this.prov.Items.Clear();
        int i = 0;
        while (sdr.Read())
        {
            this.prov.Items.Insert(i, new ListItem(sdr["prov_name"].ToString(), sdr["prov_id"].ToString()));
            if (prov_id == sdr["prov_id"].ToString())
            {
                this.prov.Items[i].Selected = true;
            }
            i++;
        }
        sdr.Close();
        con.Close();
    }

    //绑定到修改时的城市
    public void dataBindModCity(string prov_id, string city_id)
    {
        SqlConnection con = db.createSqlConneciton();
        con.Open();
        SqlCommand cmd = new SqlCommand("select * from t_city where city_provid = " + prov_id, con);
        SqlDataReader sdr = cmd.ExecuteReader();
        this.city.Items.Clear();
        int i = 0;
        while (sdr.Read())
        {
            this.city.Items.Insert(i, new ListItem(sdr["city_name"].ToString(), sdr["city_id"].ToString()));
            if (city_id == sdr["city_id"].ToString())
            {
                this.city.Items[i].Selected = true;
            }
            i++;
        }
        sdr.Close();
        con.Close();
    }

    //绑定到修改时的服务站
    public void dataBindModServstat(string city_id, string servstat_id)
    {
        SqlConnection con = db.createSqlConneciton();
        con.Open();
        SqlCommand cmd = new SqlCommand("select * from t_servstat where servstat_cityid = " + city_id, con);
        SqlDataReader sdr = cmd.ExecuteReader();
        this.servstat.Items.Clear();
        int i = 0;
        while (sdr.Read())
        {
            this.servstat.Items.Insert(i, new ListItem(sdr["servstat_name"].ToString(), sdr["servstat_id"].ToString()));
            if (servstat_id == sdr["servstat_id"].ToString())
            {
                this.servstat.Items[i].Selected = true;
            }
            i++;
        }
        sdr.Close();
        con.Close();
    }
}

参考一下我的,我这个是三级的
注意,下拉的autopostback要先上 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue三级联动下拉菜单是指一个三级级联的下拉菜单实现,其中每个层级的选项列表将随着前面选择的选项而动态更新。 实现Vue三级联动下拉菜单的步骤如下: 1. 定义绑定数据:首先需要定义三个数据对象,即第一级选项列表、第二级选项列表和第三级选项列表,以及他们的初始值。这些数据对象将通过Vue的数据绑定机制与前端界面绑定。 2. 实现选项列表的动态更新:当用户选择一级选项时,需要根据该选项对应的规则获取二级选项列表。同样的,当用户选择二级选项时,需要根据该选项对应的规则获取三级选项列表。这一步需要结合Vue的computed属性和watch机制实现。 3. 绑定前端交互事件:通过v-on指令将用户选择事件与Vue的方法绑定。当用户选择一级选项时将触发与该数据对象绑定的方法,在该方法中更新二级选项列表并清空三级选项列表。当用户选择二级选项时,将触发与该数据对象绑定的方法,在该方法中更新三级选项列表。 4. 前端界面的渲染:根据Vue的数据绑定机制,当数据对象改变时,前端界面上的内容也要相应地改变。因此,需要使用v-for指令结合绑定的数据对象遍历选项列表,并使用v-model指令将用户选择的选项与对应数据对象绑定。 总之,Vue三级联动下拉菜单是一种方便实用的前端交互方式,能够让用户在选择选项时更加快速和准确。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值