《》
项目图:
首先添加一个WebForm页面。命名为DataList。在页面拖入一个Repeater 控件,和一个ObjectDataSource控件
点击“源” 看以看到源中的代码是这样的:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DataList.aspx.cs" Inherits="WebApp.DataList" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<asp:Repeater ID="Repeater1" runat="server">
</asp:Repeater>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server"></asp:ObjectDataSource>
</form>
</body>
</html>
现在我们可以给ObjectDataSource这个控件绑定数据,因为这个ObjectDataSource控件很特别,可以绑定一个类中的某个方法。于是在这里,我们就绑定三层中的BLL层的某个类中的某个方法,比如这里我们就绑定了BLL层中的UserBll.cs类中的public List<UserInfo> GetAllUsers()这个方法。 这个方法的作用就是查询某个表中的 所有数据。它的返回值是一个List<UserInfo> 类型的数据
这样数据源就算配置好了。
然后我们在将Repeater1这个控件绑定这个ObjectDataSource数据源
然后我们可以来给源中的<asp:Repeater ID="Repeater1" runat="server">/asp:Repeater>添加内容
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DataList.aspx.cs" Inherits="WebApp.DataList" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<%--这个<Repeater>其实相当于一个for循环--%>
<asp:Repeater ID="Repeater1" runat="server" DataSourceID="ObjectDataSource1">
<%--这里则是绑定的数据源中的每一行数据--%>
<ItemTemplate>
<%--# Evak("id")表示绑定数据源中的id这个字段。其实就是表的字段,或者说是Model中映射表中的那个类的id属性--%>
<span><%# Eval("Id") %></span>
<span><%# Eval("Username") %></span>
<span><%# Eval("Name") %></span>
</ItemTemplate>
<%-- < Repeater>这个控件里可以添加一个<SeparatorTemplate>标签,这个标签的作用其实就是起到分割符的作用--%>
<SeparatorTemplate>
<div style="color: red">-----------------</div>
</SeparatorTemplate>
<%-- 头部模板--%>
<HeaderTemplate>
<%--头部模板中放了一些<span>标签--%>
<span>编号 |</span><span>用户名 |</span><span>姓名 |</span><div></div>
</HeaderTemplate>
<%--尾部模板--%>
<FooterTemplate>
<%--尾部模板中放了一个<hr/>标签--%>
<hr />
</FooterTemplate>
</asp:Repeater>
<%--ObjectDataSource控件可以绑定我们三层中的某个方法,比如这里我们可以绑定三层中的Bll层中的某个方法,比如增删查改的其中某个方法。假如绑定了查 这个方法,假如查这个方法是获取表中的所有数据,那么,这里就相当于一个数据源了。 然后我们可以在Repeater控件中来绑定这个数据源,而Repeater这个控件是用来在页面展示数据源中的数据的,所以这样就实现了将某个方法中的数据展示在页面上的目的了--%>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" SelectMethod="GetAllUsers" TypeName="Web.BLL.UserBll"></asp:ObjectDataSource>
</form>
</body>
</html>
添加完内容后大功告成了。浏览一下这样页面、。这样就达到了展示数据的目的
根据以上规则,我们再写一个。绑定的数据源都是一样。只是Repeater里的标签里的内容有一点点不一样。
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="WebApp.WebForm3" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<%--这个<Repeater>其实相当于一个for循环--%>
<asp:Repeater ID="Repeater1" runat="server" DataSourceID="ObjectDataSource1">
<%-- 头部模板--%>
<HeaderTemplate>
<table>
<tr><th>编号</th><th>用户名</th><th>姓名</th><th>年龄</th></tr>
</HeaderTemplate>
<%--这里则是绑定的数据源中的每一行数据--%>
<ItemTemplate>
<tr style="color:red"><td><%# Eval("Id") %></td><td><%# Eval("UserName") %></td><td><%# Eval("Name") %></td><td><%# Eval("Age") %></td></tr>
</ItemTemplate>
<%-- 这个标签的作用其实就是隔行(交替行)呈现(意思是:执行一行<ItemTemplate>标签的绑定,再执行一行<AlternatingItemTemplate>标签的绑定。--%>
<AlternatingItemTemplate>
<tr style="color:blue"><td><%# Eval("Id") %></td><td><%# Eval("UserName") %></td><td><%# Eval("Name") %></td><td><%# Eval("Age") %></td></tr>
</AlternatingItemTemplate>
<%--尾部模板--%>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" SelectMethod="GetAllUsers" TypeName="Web.BLL.UserBll"></asp:ObjectDataSource>
</form>
</body>
</html>
---------------------------------------------------------------------------------------------------------------------------------------------
下面我们不使用时ObjectDataSource数据源,但也使用Repeater来展示数据。那我们就看看如何做
1>首先建立一个WebForm页面.,默认名字就WebForm4.aspx吧
在这个页面中拖入一个Repeater控件
现在就将这个Repeater控件手动绑定数据源
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Web.BLL;
using Web.Model;
namespace WebApp
{
public partial class WebForm4 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
UserBll bll = new UserBll();
List<UserInfo> list = bll.GetAllUsers();
//Repeater1这个控件的数据源设为list这个对象。这个对象是一个泛型集合
this.Repeater1.DataSource = list;
//绑定
this.Repeater1.DataBind();
}
}
}
给Repeater控件板顶数据源后,我们在来设置它的展示内容
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="WebApp.WebForm4" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<%--这个<Repeater>其实相当于一个for循环--%>
<asp:Repeater ID="Repeater1" runat="server">
<%-- 头部模板--%>
<HeaderTemplate>
<table>
<tr><th>编号</th><th>用户名</th><th>姓名</th><th>年龄</th></tr>
</HeaderTemplate>
<%--这里则是绑定的数据源中的每一行数据--%>
<ItemTemplate>
<tr style="color:red"><td><%# Eval("Id") %></td><td><%# Eval("UserName") %></td><td><%# Eval("Name") %></td><td><%# Eval("Age") %></td></tr>
</ItemTemplate>
<%-- 这个标签的作用其实就是隔行(交替行)呈现(意思是:执行一行<ItemTemplate>标签的绑定,再执行一行<AlternatingItemTemplate>标签的绑定。--%>
<AlternatingItemTemplate>
<tr style="color:blue"><td><%# Eval("Id") %></td><td><%# Eval("UserName") %></td><td><%# Eval("Name") %></td><td><%# Eval("Age") %></td></tr>
</AlternatingItemTemplate>
<%--尾部模板--%>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</form>
</body>
</html>
========================
另外一种情况 就是在Repeater控件中,加入服务器端控件。Repeater控件里有10行数据,每一行数据都有一个Button服务端的删除按钮,那我们怎么知道当你点击某一个行的服务端按钮来删除一行数据的时候如何确定你是点击了哪一行的Button删除按钮?
看我是怎么做的!
其实我们是在Button这个服务端按钮中加入CommandName="Delete" CommandArgument='<%#Eval("Id") %>' 这两个属性给这个Button按钮做了标记。
因为在Repeater这个控件里面的所有服务控件(比如:button按钮) 的回发事件都会触发
protected void Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)这个方法来执行(比如:单击事件)
所以我们就先判断我们点击的这个控件的CommandName属性是不是我们标记的值。如果是在取得他的CommandArgument的值。
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="WebApp.WebForm3" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<%--这个<Repeater>其实相当于一个for循环--%>
<asp:Repeater ID="Repeater1" runat="server" DataSourceID="ObjectDataSource1" OnItemCommand="Repeater1_ItemCommand">
<%-- 头部模板--%>
<HeaderTemplate>
<table>
<tr><th>编号</th><th>用户名</th><th>姓名</th><th>年龄</th></tr>
</HeaderTemplate>
<%--这里则是绑定的数据源中的每一行数据--%>
<ItemTemplate>
<tr style="color:red">
<td><%# Eval("Id") %></td><td><%# Eval("UserName") %></td><td><%# Eval("Name") %></td><td><%# Eval("Age") %></td>
<td><a href='Edit.aspx?id=<%#Eval("Id") %>'>编辑</a></td>
<td><a href='Add.aspx?id=<%#Eval("Id") %>'>增添</a></td>
<%-- 给Repeater控件里的这个Button按钮添加一个CommandName属性--%>
<td><asp:Button ID="Button1" runat="server" Text="删除" CommandName="Delete" CommandArgument='<%#Eval("Id") %>' OnClientClick="javascript: var a=confirm('你确定要删除吗?');if(!a){return false}" /></td>
</tr>
</ItemTemplate>
<%-- 这个标签的作用其实就是隔行(交替行)呈现(意思是:执行一行<ItemTemplate>标签的绑定,再执行一行<AlternatingItemTemplate>标签的绑定。--%>
<AlternatingItemTemplate>
<tr style="color:blue">
<td><%# Eval("Id") %></td><td><%# Eval("UserName") %></td><td><%# Eval("Name") %></td><td><%# Eval("Age") %></td>
<td><a href='Edit.aspx?id=<%#Eval("Id") %>'>编辑</a></td>
<td><a href='Add.aspx?id=<%#Eval("Id") %>'>增添</a></td>
<%-- 给Repeater控件里的这个Button按钮添加一个CommandName属性--%>
<td><asp:Button ID="Button1" runat="server" Text="删除" CommandName="Delete" CommandArgument='<%#Eval("Id") %>' OnClientClick="javascript: var a=confirm('你确定要删除吗?');if(!a){return false)}" /></td>
</tr>
</AlternatingItemTemplate>
<%--尾部模板--%>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" SelectMethod="GetAllUsers" TypeName="Web.BLL.UserBll"></asp:ObjectDataSource>
</form>
</body>
</html>
具体做法
using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using Web.BLL;
using Web.Model;
namespace WebApp
{
public partial class WebForm3 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
int id = 0;
if (Request["id"] == null)
{
id = 1;
}
else
{
id = Convert.ToInt32(Request["id"].ToString());
}
//int id = Request["id"].ToString()==null?1:int.Parse(Request["id"].ToString());
//UserBll bll = new UserBll();
//List<UserInfo> list = bll.PagingPage(id);
//this.Repeater1.DataSource = list;
//this.Repeater1.DataBind();
//每次页面加载的时候生成分页的导航HTML,并设置到Literal1
this.Literal1.Text = PagerHelper.strPage(6, 3, 2, id, "WebForm3.aspx?id=");
}
//在Repeater这个控件里面的所有服务控件(比如:button按钮)的回发事件都会触发该方法来执行(比如:单击事件)
//所以在该方法中需要根据CommandName来区分用户单击的是哪个控件
protected void Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandName == "Delete")
{
UserBll bll = new UserBll();
//这里相当于获取了你点击的那个控件的id。(注意:只是相当于,因为这并不是真正的ID,只是我们自己设置的标记)
int sid = Convert.ToInt32(e.CommandArgument);
if (bll.Delete(sid) > 0)
{
//删除数据后实现页面刷新
//Response.Redirect("WebForm3.aspx");
//或者重新绑定数据
this.Repeater1.DataBind();
}
}
}
//--------怎么控制Repeater控件中的每个单元格(例如<td>)
//这个事件就是当前项绑定完毕后触发的事件(比如说:List集合中有20条数据,这20条数据是逐条来实现绑定的,当第一条数据绑定完毕后就会触发该事件)
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
//看我们如何操作Repeater中的数据
//表示是数据行
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
//现在我们要将年龄小于25岁的年龄颜色设置为红色
//1>获取当前行的数据
// e.Item.DataItem表示数据源中的一行,如果数据源是List<T>集合,则e.Item.DataItem表示的是一个List中的对象,即Model)
//如果绑定的数据源是DataTable 则e.Item.DataItem表示DataTable中的的一行DataRow
object obj = e.Item.DataItem;
//因为我的数据源是DataTable 所以这里进行数据转换
UserInfo u = obj as UserInfo;
if (u.Age < 25)
{
//获取年龄这个<td runat="server" id="age"> 这个服务端控件
Control control = e.Item.FindControl("age");
//通过调试我们发现control这个对象的实际类是HtmlTableCell类型。它是Control类的子类
HtmlTableCell htc = control as HtmlTableCell;
//可以在这里直接设置它的背景色
//htc.BgColor = "Black";
//因为没有直接设置前景色的属性。所以我们也可以通过给控件添加属性的方式来设置样式
htc.Attributes.Add("style", "color:yellow");
}
}
}
}
}
这里提供分页的PagerHelper.cs类
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
namespace Web.BLL
{
public static class PagerHelper
{
#region 数字分页类
/// <summary>
///
/// </summary>
/// <param name="intCounts">数据总条数</param>
/// <param name="intPageSizes">页大小</param>
/// <param name="intPageCounts">总共页数</param>
/// <param name="intThisPages">当前页</param>
/// <param name="strUrl">要提交到的页面</param>
/// 使用: this.Literal1.Text = PagerHelper.strPage(6, 3, 2, id, "WebForm3.aspx?id=");
/// <returns></returns>
public static string strPage(int intCounts, int intPageSizes, int intPageCounts, int intThisPages, string strUrl)
{
int intCount = Convert.ToInt32(intCounts); //总记录数
int intPageCount = Convert.ToInt32(intPageCounts); //总共页数
int intPageSize = Convert.ToInt32(intPageSizes); //每页显示
int intPage = 7; //数字显示
int intThisPage = Convert.ToInt32(intThisPages); //当前页数
int intBeginPage = 0; //开始页数
int intCrossPage = 0; //变换页数
int intEndPage = 0; //结束页数
string strPage = null; //返回值
intCrossPage = intPage / 2;
strPage = "共 <font color=\"#FF0000\">" + intCount.ToString() + "</font> 条记录 第 <font color=\"#FF0000\">" + intThisPage.ToString() + "/" + intPageCount.ToString() + "</font> 页 每页 <font color=\"#FF0000\">" + intPageSize.ToString() + "</font> 条 ";
if (intThisPage > 1)
{
strPage = strPage + "<a href=\"" + strUrl + "1\">首页</a> ";
strPage = strPage + "<a href=\"" + strUrl + Convert.ToString(intThisPage - 1) + "\">上一页</a> ";
}
if (intPageCount > intPage)
{
if (intThisPage > intPageCount - intCrossPage)
{
intBeginPage = intPageCount - intPage + 1;
intEndPage = intPageCount;
}
else
{
if (intThisPage <= intPage - intCrossPage)
{
intBeginPage = 1;
intEndPage = intPage;
}
else
{
intBeginPage = intThisPage - intCrossPage;
intEndPage = intThisPage + intCrossPage;
}
}
}
else
{
intBeginPage = 1;
intEndPage = intPageCount;
}
if (intCount > 0)
{
for (int i = intBeginPage; i <= intEndPage; i++)
{
if (i == intThisPage)
{
strPage = strPage + " <font color=\"#FF0000\">" + i.ToString() + "</font> ";
}
else
{
strPage = strPage + " <a href=\"" + strUrl + i.ToString() + "\" title=\"第" + i.ToString() + "页\">" + i.ToString() + "</a> ";
}
}
}
if (intThisPage < intPageCount)
{
strPage = strPage + "<a href=\"" + strUrl + Convert.ToString(intThisPage + 1) + "\">下一页</a> ";
strPage = strPage + "<a href=\"" + strUrl + intPageCount.ToString() + "\">尾页</a> ";
}
return strPage;
}
#endregion
}
}