DropDownList的使用方法！（复杂应用)--------C#语言

我新建了两个DropDownList控件A和B,A下拉之有三个选项：A1,A2,A3；当A控件选中A1的时候，下拉B控件，就会显示A11,A12,A13,A14,A15这几个选项，当A控件选中A2时，下拉B控件，就会显示A21,A22,A23,A24,A25这几个选项；A3亦如此！
   怎样实现这样的功能呢？
　
　或者这样描述问题：
　现在有一批物品进行分类，现分为三类：A1，A2，A3 三类，而A1中又有A11,A12,A13,A14,A15五个小类；A2中也有A21,A22,A23,A24,A25几个小类；A3亦如此；
   问题是：什么控件可以实现上述的分类的功能呢？或者说设计一个怎样的用户界面才能使用户选择类别的时候方便呢？
  谢谢

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

myminimouse：你发的那个帖子连接那个是正确的阿
我用的是asp.net 和C#语言
asp里面的东西我看不懂啊
首先,写一个自定义的方法,用来加载B下拉控件中的项
private void LoadItems(string strA)
{
  B.Items.Clear();  for(int i = 1; i < 6; i += 1)
  {
    B.Items.Add(strA + i.ToString());
  }
}然后,将A下拉控件的AutoPostBack属性设置为True并在A下拉控件中的SelectedIndexChanged事件中写入以下代码B.Items.Clear();for(int i = 1; i < 6; i += 1)
{
  B.Items.Add(A.SelectedItem.ToString() + i.ToString());
}---------------------------------------------------------
这段代码只为满足你所提出的需求,不具有通用性,但可根据需要自己适当修改
<script type="text/javascript" >
var categoryCount;
categoryArray = new Array();
<%=categoryArray%>
categoryCount=<%=i%>;
function changelocation(locationid)
{
document.getElementById("categoryid").length = 0;
var locationid=locationid;
var i;
for (i=0;i < categoryCount; i++)
{
if (categoryArray[i][1] == locationid)
{
document.getElementById("categoryid").options[document.getElementById("categoryid").length] = new Option(categoryArray[i][0], categoryArray[i][2]);
}
}
}
</script>
                <asp:DropDownList ID="sortsid" runat="server" >
                    <asp:ListItem Value="0">选择大类</asp:ListItem>
                </asp:DropDownList>小类：
                <asp:DropDownList ID="categoryid" runat="server" >
                    <asp:ListItem Value="0">选择小类</asp:ListItem>
                </asp:DropDownList>后台代码:
        public string categoryArray="";
        public int i = 0;
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                binderSort();
                binderCategory();
                sortsid.Attributes.Add("onChange", "changelocation(document.getElementById('sortsid').options[document.getElementById('sortsid').selectedIndex].value)");
            }

        }        //绑定大类
        void binderSort()
        {
           SqlDataReader sdr= CwgShop.DAL.SQLHelper.ExecuteReader(CwgShop.DAL.SQLHelper.CONN_STRING, CommandType.Text, "Select Sort,SortID from [Sort]");
           while (sdr.Read())
           {
               sortsid.Items.Add(new ListItem(sdr[0].ToString(), sdr[1].ToString()));
           }
        }        //绑定小类
        void binderCategory()
        {
            SqlDataReader sdr= CwgShop.DAL.SQLHelper.ExecuteReader(CwgShop.DAL.SQLHelper.CONN_STRING, CommandType.Text, "Select CategoryName,CategoryID,SortID from [Category] Order by CategoryOrder Desc");
            StringBuilder array=new StringBuilder();
            while (sdr.Read())
            {
                //categoryid.Items.Add(new ListItem(sdr[0].ToString(), sdr[1].ToString()));
                array.Append("categoryArray[" + i.ToString() + "] = new Array('" + sdr[0].ToString() + "', '" + sdr[2].ToString() + "', '" + sdr[1].ToString() + "');" + System.Environment.NewLine);
                i += 1;
            }
            categoryArray = array.ToString();
        }
我是这样实现得,不知道你觉得怎么样.
不好!  像这种应该用ajax!<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>double_downlist</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
function button_onclick()    {
   var num=document.Form1.Select1.value;

   var response =double_downlist.aa (num,ServerSideAdd_CallBack);
   if(response.value==null)
   Label1.innerText="请稍后....";
   }


function ServerSideAdd_CallBack(response)
{

var ds = response.value;
if(ds != null && typeof(ds) == "object" && ds.Tables != null)
{
  // document.Form1.TextBox1.value=ds.Tables[0].Rows[0].id;
  // document.Form1.TextBox2.value=ds.Tables[0].Rows[0].text;





  while ((k=document.Form1.Select2.length-1)>=0)
   {


      if(document.Form1.Select2.length<0)
       break;
    document.Form1.Select2.options.remove(k);


   }

  for(i=0;i<ds.Tables[0].Rows.length;i++)
  {

    var SelectedText = ds.Tables[0].Rows[i].demo_name;
  var SelectedValue = ds.Tables[0].Rows[i].id;
  document.Form1.Select2.options.add(new Option(SelectedText,SelectedValue));
  }
   Label1.innerText="";
} }
</script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form name="Form1" method="post" action="double_downlist.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE" value="dDw2NDY1NTg0NjQ7dDw7bDxpPDE+Oz47bDx0PDtsPGk8MT47PjtsPHQ8dDxwPGw8RGF0YVZhbHVlRmllbGQ7RGF0YVRleHRGaWVsZDs+O2w8aWQ7ZGVtb19uYW1lOz4+O3Q8aTwzPjtAPC5uZXTlsI/mioDlt6c7YWpheOaKgOacr+aooeeJiDtqYXZhU2NyaXB05oqA5pyv5qih5p2/Oz47QDwxODsyOzY7Pj47Pjs7Pjs+Pjs+Pjs+ZrqflC061lkx+p2rMoHvebg4cag=" />
<script type="text/javascript" src="/Tct_demo/ajax/common.ashx"></script> <script type="text/javascript" src="/Tct_demo/ajax/TCT_DEMO.double_downlist,TCT_DEMO.ashx"></script>
<select name="Select1" id="Select1" onchange="button_onclick()" style="Z-INDEX: 101; LEFT: 216px; WIDTH: 120px; POSITION: absolute; TOP: 232px">
<option value="18">.net小技巧</option>
<option value="2">ajax技术模版</option>
<option value="6">javaScript技术模板</option>
</select>
<select name="Select2" id="Select2" style="Z-INDEX: 102; LEFT: 408px; WIDTH: 120px; POSITION: absolute; TOP: 232px">
</select>
<span id="Label1" style="width:120px;Z-INDEX: 103; LEFT: 224px; POSITION: absolute; TOP: 280px"></span>
</form>
</SPAN>
</body>
</HTML>