Webform（Repeater控件）

Posted 2020-08-14 fei！

一、Repeater控件

有五大模板

 ItemTemplate :有多少条数据，执行多少遍      
  AlternatingItemTemplate : 对交替数据项进行格式设置      
 SeparatorTemplate : 对分隔符进行格式设置      
  HeaderTemplate : 对页眉进行格式设置 ，在加载开始执行一遍    
  FooterTemplate : 对页脚进行格式设置，在加载最后执行一遍     

1.数据绑定

list<Users> li =new usersData().Select();

Repeater1.DataSource=li;
Repeater1.DataBind();

2.属性扩展和数据访问类构建

并判断年龄是不是大于16岁，大于的话背景色变红（库存预警）

 public string UserName { get; set; }
    public string PassWord { get; set; }
    public string NickName { get; set; }
    public string NickName1
    {
        get
        {
            if (NickName == "")
            {
                return "<无>";
            }
            else
            {
                return NickName;
            }
        }

    }


    public bool Sex { get; set; }
    public string SexStr
    {
        get { return Sex ? "男" : "女"; }
    }


    public DateTime Birthday { get; set; }
    public string BirStr
    {
        get
        {
            return Birthday.ToString("yyyy年MM月dd日");
        }
    }

    public int Age {
        get {
            return DateTime.Now.Year - Birthday.Year;
        }
    
    }

    public string Red
    {
        get {
            if (Age > 16)
            {
                return "background-color:red;";
            }
            else
            {
                return "";
            }
        }
    }

    public string Nation { get; set; }

User

3.代码

<asp:Repeater ID="Repeater1" runat="server">
            <HeaderTemplate>
                <table id="tb1">
                    <tr id="tr_head">
                        <td>用户名</td>
                        <td>密码</td>
                        <td>昵称</td>
                        <td>性别</td>
                        <td>生日</td>
                        <td>年龄</td>
                        <td>民族</td>
                    </tr>
            </HeaderTemplate>
            <ItemTemplate>
                <tr class="tr_item" style="<%#Eval("Red")%>">
                    <td><%#Eval("Username") %></td>
                    <td><%#Eval("PassWord") %></td>
                    <td><%#Eval("NickName1") %></td>
                    <td><%#Eval("SexStr") %></td>
                    <td><%#Eval("BirStr") %></td>
                    <td><%#Eval("Age") %></td>
                    <td><%#Eval("Nation") %></td>
                </tr>
            </ItemTemplate>
            <FooterTemplate>
                </table>
            </FooterTemplate>
        </asp:Repeater>

项模板中数据显示：<%# Eval("属性名")%>

4.光棒效果，并且保留原有颜色

 <script type="text/javascript">
            var oItems = document.getElementsByClassName("tr_item");
            for (var i = 0; i < oItems.length; i++)
            {
                var oldColor = "";
                oItems[i].onmouseover = function () {
                    oldColor = this.style.backgroundColor;
                    this.style.backgroundColor = "yellow";
                };

                oItems[i].onmouseout = function () {
                    this.style.backgroundColor = oldColor;

                };
            }
</script>

二、webform的三级联动

与winform一样，只不过需把DropDownList的AutoPostBack属性改为True。

*简单日期的编写方法：
用是三个DropDownList分别代表年月日，用for循环进行数据绑定，同时并对日进行判断

  for (int i = DateTime.Now.Year; i >= 1900; i--)
            {
                ListItem li = new ListItem(i.ToString());
                Year_Dr.Items.Add(li);
            }

            for (int i = 1; i <= 12; i++)
            {
                ListItem li = new ListItem(i.ToString());
               Mouth_dr.Items.Add(li);
            }

            Days();
           Mouth_dr.SelectedValue = DateTime.Now.Month.ToString();
           Day_dr.SelectedValue = DateTime.Now.Day.ToString();
        }

        Year_Dr.SelectedIndexChanged +=Year_Dr_SelectedIndexChanged;
        Mouth_dr.SelectedIndexChanged +=Mouth_dr_SelectedIndexChanged;
//方法及事件

 private void Days()
    {
        for (int i = 1; i <= 31; i++)
        {
            int year = Convert.ToInt32(Year_Dr.SelectedValue);
            int mouth = Convert.ToInt32(Mouth_dr.SelectedValue);
            if (mouth == 1 || mouth == 3 || mouth == 5 || mouth == 7 || mouth == 8 || mouth == 10 || mouth == 12)
            {
            }
            else if (mouth == 4 || mouth == 6 || mouth == 9 || mouth == 11)
            {
                if (i == 31)
                {
                    break;
                }
            }
            else if (year % 400 == 0 || (year % 4 == 0 && year % 100 != 0))
            {
                if (i == 30)
                {
                    break;
                }
            }
            else
            {
                if (i == 29)
                {
                    break;
                }
            }
            ListItem li = new ListItem(i.ToString());
            Day_dr.Items.Add(li);
        }
    }

void Mouth_dr_SelectedIndexChanged(object sender, EventArgs e)
{
    Day_dr.Items.Clear();
    Days();
    
}

void Year_Dr_SelectedIndexChanged(object sender, EventArgs e)
{
    Mouth_dr.Items.Clear();
    Day_dr.Items.Clear();
    for (int i = 1; i <= 12; i++)
    {
        ListItem li = new ListItem(i.ToString());
        Mouth_dr.Items.Add(li);
    }

    Days();
}

日期

注：

PlaceHolder给文本框添加水印文字；

js代码中window.onload = function () {}为页面加载完成成执行脚本，return false 阻止按钮执行操作