使用Repeater控件实现三层嵌套以及分页效果

时间:2023-03-08 21:08:45
使用Repeater控件实现三层嵌套以及分页效果

PS: 第一次用Repeater控件 记录一下

请忽略我的命名不规范  请忽略我的最终效果图(太丑了) 需要用到的朋友可以自行调整的漂亮点

====================最终效果图===================

使用Repeater控件实现三层嵌套以及分页效果

=====================HTML======================

   <body>
<form id="form1" runat="server">
<div>
<div>
<asp:Repeater ID="ParentRepeater" runat="server" OnItemCommand="ParentRepeater_ItemCommand" OnItemDataBound="ParentRepeater_ItemDataBound">
<HeaderTemplate>
<table width="95%" id="ListArea" border="0" class="t1" align="center" cellpadding="0" cellspacing="0" style="margin-top:10px; table-layout:fixed ;">
<tr>
<th></th>
<th>序号</th>
<th>编号</th>
<th>简称</th>
<th>性质</th>
<th>种类</th>
<th>日期</th>
<th>人</th>
<th>项</th>
<th>操作</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr class="Parent">
<td>
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Images/QualitySafety/Open.png" Width="15" Height="15" CommandName="zhe_Repeater2" CommandArgument='<%# Eval("ID") %>' AccessKey="1" />
</td>
<td><%# Eval("ID") %></td>
<td><%# Eval("NO") %></td>
<td><%# Eval("Abbreviation") %></td>
<td><%# Eval("CheckProperties") %></td>
<td><%# Eval("CheckSpecies") %></td>
<td><%# Eval("CheckTime") %></td>
<td><%# Eval("CheckUserInfo_Name") %></td>
<td><%# Eval("CheckContent") %></td>
<td><asp:LinkButton ID="select" CommandName="select" runat="server" CommandArgument='<%#Eval("ID") %>'
PostBackUrl='<%#"ModefyStaff.aspx?id="+Eval("ID")%>' Text="查看进度"></asp:LinkButton></td>
</tr>
<tr class="child" >
<td colspan="9">
<asp:Repeater ID="childRepeater" runat="server" Visible="false" OnItemDataBound="childRepeater_ItemDataBound">
<HeaderTemplate>
<table class="tb_jieguo" style="background-color:#F2F4F8; margin-left:100px; width:90%; text-align:center" cellpadding="0" cellspacing="0" >
<tr>
<th>检查结果</th>
<th>图片</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td ><%# Eval("ResultDescribe") %></td>
<td>
<asp:Repeater ID="IMGRepeater" runat="server">
<ItemTemplate>
<span><img src="<%# Eval("ImgUrl") %>" /></span>
</ItemTemplate>
</asp:Repeater>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
<div style=" margin-top:50px; margin:auto; text-align:center; width:80%">
<table style="margin:auto; width: 716px;" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="height: 19px; width:90px" align="center" >
<asp:LinkButton ID="lbtnFirstPage" runat="server" OnClick="lbtnFirstPage_Click" style="text-decoration: none;">首页</asp:LinkButton></td>
<td style="width: 90px; height: 19px" align="center" >
<asp:LinkButton ID="lbtnpritPage" runat="server" OnClick="lbtnpritPage_Click" style="text-decoration: none;">上一页</asp:LinkButton></td>
<td style="height: 19px; width:90px" align="center">
<asp:LinkButton ID="lbtnNextPage" runat="server" OnClick="lbtnNextPage_Click" style="text-decoration: none;">下一页</asp:LinkButton></td>
<td style="height: 19px; width:90px" align="center">
<asp:LinkButton ID="lbtnDownPage" runat="server" OnClick="lbtnDownPage_Click" style="text-decoration: none;">末页</asp:LinkButton></td>
<td align="center" colspan="2" class="auto-style1">
第<asp:Label ID="labPage" runat="server" Text="Label"></asp:Label>页/共<asp:Label ID="LabCountPage" runat="server" Text="Label"></asp:Label>页</td>
<td style="height: 19px; width:150px" align="center" colspan="2">
跳至第 <asp:DropDownList ID="ddlp" AutoPostBack="true" runat="server" Height="19px" Width="67px" OnSelectedIndexChanged="ddlp_SelectedIndexChanged">
</asp:DropDownList>页
</td>
</tr>
</table>
</div>
</div>
</form>
</body>

=======================后台代码=====================

         protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
/*初始化的时候给当前第几页赋值为1*/
this.labPage.Text = "";
/*调用显示方法*/
this.contrlRepeater();
} } #region 折叠功能
protected void ParentRepeater_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
/*判断是否点击的折叠控件
* 在折叠控件ImageButton里设置了CommandName这个属性
* 通过这个属性来判断是不是你指定的控件*/
if (e.CommandName == "zhe_Repeater2")
{
/*从Repeater控件里找ID为ImageButton1的ImageButton控件
从Repeater控件里找ID为childRepeater的Repeater控件 */
ImageButton ImageButton1 = (ImageButton)e.Item.FindControl("ImageButton1");
Repeater childRepeater = (Repeater)e.Item.FindControl("childRepeater");
if (ImageButton1.AccessKey == "") /*+展开(加号图片) 1*/
{
/*如果展开 则显示子层Repeater
* 并改变AccessKey属性设置成0(代表收起的样式图片)
* 改变ImageUrl图片路径 存放收起(减号图片)*/
childRepeater.Visible = true;
ImageButton1.AccessKey = "";
ImageButton1.ImageUrl = "~/Images/QualitySafety/Close.png";
}
else /*-收起(减号图片) 0*/
{
/*同上 相反*/
childRepeater.Visible = false;
ImageButton1.AccessKey = "";
ImageButton1.ImageUrl = "~/Images/QualitySafety/Open.png";
}
}
}
}
#endregion #region 绑定Repeater数据源
/*在第一级Repeater的ItemDataBound事件中绑定第二级Repeater*/
protected void ParentRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
/*触发对象的类型是DadaList里的基本行或是替换行*/
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
/*获取当前点击行的ID
并找到第二层Repeater 如果有这个控件则进行数据源绑定*/
string preid = ((DataRowView)e.Item.DataItem).Row["ID"].ToString();//获得对应ID
Repeater childRepeater = (Repeater)e.Item.FindControl("childRepeater");//找到要绑定数据的childRepeater
if (childRepeater != null)
{
DataTable QualitySafetyInfoChildList = QualitySafetyBLL.QualitySafetyInfoChildList(preid);//获取结果信息
childRepeater.DataSource = QualitySafetyInfoChildList;
childRepeater.DataBind(); } } }
/*在第二级Repeater的ItemDataBound事件中绑定第三级Repeater*/
protected void childRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
/*查找第二层的ID*/
string preid = ((DataRowView)e.Item.DataItem).Row["ID"].ToString();//获得对应ID
Repeater IMGRepeater = (Repeater)e.Item.FindControl("IMGRepeater");//找到要绑定数据的IMGRepeater第三层
if (IMGRepeater != null)
{
DataTable QualitySafetyInfoIMGList = QualitySafetyBLL.QualitySafetyInfoIMGList(preid);//获取图片信息
IMGRepeater.DataSource = QualitySafetyInfoIMGList;
IMGRepeater.DataBind(); } }
}
#endregion #region 实现分页 /*Repeater分页控制显示方法 */
public void contrlRepeater()
{ /*获取第一层隐患信息 每页要显示的数据*/
DataTable QualitySafetyInfoList = QualitySafetyBLL.QualitySafetyInfoList(Convert.ToInt32(labPage.Text)); /*获取第一层隐患信息总数 */
DataTable QualitySafetyInfoListCount = QualitySafetyBLL.QualitySafetyInfoListCount();
PagedDataSource pds = new PagedDataSource();
int cup = Convert.ToInt32(this.labPage.Text); //当前页数,初始化为第1页
pds.DataSource = QualitySafetyInfoList.DefaultView;
pds.AllowPaging = true; /*true 启动分页*/
pds.PageSize = ; /*设置每页显示多少条数据*/
pds.CurrentPageIndex = Convert.ToInt32(this.labPage.Text) - ;/*获取当前页的索引*/
/*总页数=总记录数/每页显示的数量*/
int pagecount = Convert.ToInt32(QualitySafetyInfoListCount.Rows.Count) / Convert.ToInt32(pds.PageSize);
LabCountPage.Text = pagecount.ToString(); /*总页数*/
labPage.Text = (pds.CurrentPageIndex + ).ToString();/*第几页*/
/*第一次进来循环总页数 并向下拉框添加数据*/
if (!IsPostBack)
{
for (int i = ; i < pagecount + ; i++)
{
this.ddlp.Items.Add(i.ToString());
} }
try
{/*改变下拉框的选定值*/
ddlp.SelectedValue = cup.ToString(); }
catch (Exception ex)
{
throw ex;
} /*如果当前为第一页则禁用 首页按钮和上一页按钮 否则开启按钮*/
if (pds.CurrentPageIndex < )
{
this.lbtnpritPage.Enabled = false;
this.lbtnFirstPage.Enabled = false;
this.lbtnpritPage.Style["color"] = "#BCBFCE";
this.lbtnFirstPage.Style["color"] = "#BCBFCE";
}
else
{
this.lbtnpritPage.Enabled = true;
this.lbtnFirstPage.Enabled = true;
this.lbtnpritPage.Style["color"] = "#0000EE";
this.lbtnFirstPage.Style["color"] = "#0000EE";
}
/*如果当前为最后一页则禁用 尾页按钮和下一页按钮 否则开启按钮*/
if (pds.CurrentPageIndex == pagecount - )
{
this.lbtnNextPage.Enabled = false;
this.lbtnDownPage.Enabled = false;
this.lbtnNextPage.Style["color"] = "#BCBFCE";
this.lbtnDownPage.Style["color"] = "#BCBFCE";
}
else
{
this.lbtnNextPage.Enabled = true;
this.lbtnDownPage.Enabled = true;
this.lbtnNextPage.Style["color"] = "#0000EE";
this.lbtnDownPage.Style["color"] = "#0000EE";
}
/*绑定第一层Repeater数据源*/
ParentRepeater.DataSource = QualitySafetyInfoList;
ParentRepeater.DataBind(); } /*首页*/
protected void lbtnFirstPage_Click(object sender, EventArgs e)
{
if (labPage.Text != "")
labPage.Text = "";
else
{
Response.Write("<script language=javascript>" + "alert('已经是第一页')" + "</script>");
}
contrlRepeater(); }
/*上一页*/
protected void lbtnpritPage_Click(object sender, EventArgs e)
{
try
{
if (Convert.ToInt16(labPage.Text) > )
{
labPage.Text = Convert.ToString(Convert.ToInt32(labPage.Text) - );
ddlp.SelectedValue = labPage.Text;
contrlRepeater();
}
else
{
Response.Write("<script language=javascript>" + "alert('已经是第一页')" + "</script>");
}
}catch (Exception ex)
{
Response.Write("<script language=javascript>" + "alert('已经是第一页')" + "</script>");
} }
/*下一页*/
protected void lbtnNextPage_Click(object sender, EventArgs e)
{
try
{
this.labPage.Text = Convert.ToString(Convert.ToInt32(labPage.Text) + );
this.contrlRepeater();
}catch (Exception ex)
{
Response.Write("<script language=javascript>" + "alert('已经是最后一页')" + "</script>");
labPage.Text = "";
contrlRepeater();
}
}
/*尾页*/
protected void lbtnDownPage_Click(object sender, EventArgs e)
{
if (labPage.Text.ToString() != LabCountPage.Text.ToString())
labPage.Text = LabCountPage.Text.ToString();
else
{
Response.Write("<script language=javascript>" + "alert('已经是最后一页')" + "</script>");
}
contrlRepeater(); } protected void ddlp_SelectedIndexChanged(object sender, EventArgs e)
{
/*下拉列表框更改时激发 */
int page = Convert.ToInt16((ddlp.SelectedItem.Value));
labPage.Text = page.ToString();
contrlRepeater(); }
#endregion

批注:分页主要实现在于sql语句上

select   top  每页显示的记录数 *  from  表名  where  id  not   in  ( select   top  (当前的页数-1)*每页显示的记录数 id  from  表名   order   by  id  desc )  order   by  id  desc