7.17 三级联动 控件及JS简单使用

一、程序制作的步骤：
1、想想是要实现什么功能，把界面搭出来
2、想想在哪里写代码
3、补齐一些小问题

如果这3步也解决不了问题，那么问题出在你就不知道这个程序是要干什么

二、用户体验问题：
让用户简便的操作 - 站在使用者的角度来考虑程序的设计

去网上找一些类似的程序来看看他们是如何设计的，或者是模板

三、控件数据的加载：
例如：DropDownList里面添加年月日，不需要手动添加，可是使用循环

    public void LoadDate(int start, int end, DropDownList dd)
    {
        for (int i = start; i <= end; i++)
        {
            ListItem li = new ListItem();
            li.Text = i.ToString();
            li.Value = i.ToString();

            dd.Items.Add(li);
        }
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        

        if (IsPostBack == false)
        {
            LoadDate(1900, DateTime.Now.Year, DropDownList1);
            LoadDate(1, 12, DropDownList2);
            LoadDate(1, 31, DropDownList3);

            foreach (ListItem li in DropDownList1.Items)
            {
                if (li.Text == "1980")
                {
                    li.Selected = true;
                }
          }
  }

 

 

数据库数据加载：

          List<Nation> NaList = context.Nation.ToList();//将Nation表中的数据全部取出来变成一个泛型集合

            //foreach (Nation na in NaList)
            //{
            //    ListItem li = new ListItem(na.NationName, na.NationCode);
            //    DropDownList4.Items.Add(li);
            //}

            DropDownList4.DataSource = NaList;
            DropDownList4.DataTextField = "NationName";
            DropDownList4.DataValueField = "NationCode";
            DropDownList4.DataBind();

 

四、事件的委托写法：
优点：清晰，易于查找

控件名.事件名 += （按两下tab键，会自动创建事件出来）

 Button1.Click += Button1_Click;//提交按钮事件

五、三级联动：
AutoPostBack - 自动提交事件

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Default2 : System.Web.UI.Page
{
    DataClasses2DataContext context = new DataClasses2DataContext();//LinQ操作类

    List<ChinaStates> list = new List<ChinaStates>();

    protected void Page_Load(object sender, EventArgs e)//页面加载事件
    {
        DropDownList1.SelectedIndexChanged += DropDownList1_SelectedIndexChanged;//省的下拉列表选项更改事件
        DropDownList2.SelectedIndexChanged += DropDownList2_SelectedIndexChanged;
        
        list = context.ChinaStates.ToList();//将全部的地区数据查询出来

        if (IsPostBack == false)
        {
            #region 绑定省数据
            List<ChinaStates> sheng = list.Where(r => r.ParentAreaCode == "0001").ToList();

            DropDownList1.DataSource = sheng;
            DropDownList1.DataTextField = "AreaName";
            DropDownList1.DataValueField = "AreaCode";
            DropDownList1.DataBind();
            #endregion

            #region 绑定市数据
            string shengCode = DropDownList1.SelectedItem.Value;

            List<ChinaStates> shi = list.Where(r => r.ParentAreaCode == shengCode).ToList();
            DropDownList2.DataSource = shi;
            DropDownList2.DataTextField = "AreaName";
            DropDownList2.DataValueField = "AreaCode";
            DropDownList2.DataBind();
            #endregion

            List<ChinaStates> quxian = list.Where(r => r.ParentAreaCode == DropDownList2.SelectedItem.Value).ToList();
            DropDownList3.DataSource = quxian;
            DropDownList3.DataTextField = "AreaName";
            DropDownList3.DataValueField = "AreaCode";
            DropDownList3.DataBind();
        }
    }

    void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
    {
        List<ChinaStates> quxian = list.Where(r => r.ParentAreaCode == DropDownList2.SelectedItem.Value).ToList();
        DropDownList3.DataSource = quxian;
        DropDownList3.DataTextField = "AreaName";
        DropDownList3.DataValueField = "AreaCode";
        DropDownList3.DataBind();
    }

    //省选项改变事件
    void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        string shengCode = DropDownList1.SelectedItem.Value;

        List<ChinaStates> shi = list.Where(r => r.ParentAreaCode == shengCode).ToList();
        DropDownList2.DataSource = shi;
        DropDownList2.DataTextField = "AreaName";
        DropDownList2.DataValueField = "AreaCode";
        DropDownList2.DataBind();

        List<ChinaStates> quxian = list.Where(r => r.ParentAreaCode == DropDownList2.SelectedItem.Value).ToList();
        DropDownList3.DataSource = quxian;
        DropDownList3.DataTextField = "AreaName";
        DropDownList3.DataValueField = "AreaCode";
        DropDownList3.DataBind();
    }
}

 

六、Repeater灵活使用：
不要认为Repeater只能制作table表格，它叫重复器，可以重复的制作任何东西

七、JS知识补充：
1、用JS来制作超链接按钮 - window.open();
2、如果要把JS代码写在head里面，那么需要加window.onload事件
注意：
JS的方法不能写在onload事件中

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default4.aspx.cs" Inherits="Default4" %>

<!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 type="text/javascript">
        window.onload = function () {
            var oBtn1 = document.getElementById('btn1');
            oBtn1.onclick = function () {
                window.open('Default1.aspx', '_blank');
            };
        };
            function bbb()
            {
                alert('bbb');
            }
        
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
        <asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button2_Click" /><asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
        <a href="Default1.aspx" target="_blank">注册</a>
        <input type="button" id="btn1" value="注册"/>
         <input type="button" value="呵呵" onclick="bbb();" />
    </form>
</body>
</html>

    protected void Page_Load(object sender, EventArgs e)
    {
        
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        Response.Redirect("Default1.aspx");
    }
    protected void Button2_Click(object sender, EventArgs e)
    {
        Label1.Text = "123";
    }
}