rowspan原理,rowspan的含义是
asp.net内容分页问题
DataList分页方法的核心原理是利用PagedDataSource对象,PagedDataSource类封装了DataGrid 控件的属性,这些属性使 DataGrid 可以执行分页,下面是PagedDataSource的公共属性:
AllowCustomPaging 获取或设置指示是否启用自定义分页的值。
AllowPaging 获取或设置指示是否启用分页的值。
Count 获取要从数据源使用的项数。
CurrentPageIndex 获取或设置当前页的索引。
DataSource 获取或设置数据源。
DataSourceCount 获取数据源中的项数。
FirstIndexInPage 获取页中的第一个索引。
IsCustomPagingEnabled 获取一个值,该值指示是否启用自定义分页。
IsFirstPage 获取一个值,该值指示当前页是否是首页。
IsLastPage 获取一个值,该值指示当前页是否是最后一页。
IsPagingEnabled 获取一个值,该值指示是否启用分页。
IsReadOnly 获取一个值,该值指示数据源是否是只读的。
IsSynchronized 获取一个值,该值指示是否同步对数据源的访问(线程安全)。
PageCount 获取显示数据源中的所有项所需要的总页数。
PageSize 获取或设置要在单页上显示的项数。
VirtualCount 获取或设置在使用自定义分页时数据源中的实际项数。
那么如何使用 PagedDataSource对象进行DataList分页呢?(网上有很多的讲DataList分页的文章,有一些是糊弄人的,有的还无法起作用,我被骗过一次,本文是我经过个人实践经验得到,可以顺利执行。希望对大家有所帮助。)
现在开始拉!
第一步,取出数据到datatable中,然后获得dataview,付给PagedDataSource对象
DataView objView = objTable.DefaultView;
PagedDataSource objPds = new PagedDataSource();
objPds.DataSource = objView;
第二步,PagedDataSource对象objPds的设置
objPds.AllowPaging = true;
objPds.PageSize = 4;
objPds.CurrentPageIndex = int.Parse(ViewState["pageindex"].ToString());
上面的这两段代码都是写在BindData()函数中的,供每次点击分页按钮时调用。BindData()函数如下:
private void BindData()
{
string sql = "SELECT * From team";
DataTable objTable = data.GetDataTable(sql);
if (objTable != null objTable.Rows.Count 0)
{
DataView objView = objTable.DefaultView;
PagedDataSource objPds = new PagedDataSource();
objPds.DataSource = objView;
objPds.AllowPaging = true;
objPds.PageSize = 4;
objPds.CurrentPageIndex = int.Parse(ViewState["pageindex"].ToString());
if (!objPds.IsFirstPage)
{
lkPre.Visible = true;
}
else
{
lkPre.Visible = false;
}
if (!objPds.IsLastPage)
{
lkNext.Visible = true;
}
else
{
lkNext.Visible = false;
}
dlData.DataSource = objPds;
dlData.DataBind();
}
}
到此为止,我们已经将数据交给了PagedDataSource,剩下的分页将利用PagedDataSource 进行处理。可能大家注意到了,这个数据交付是完整的数据交付,如果数据量很大会造成一定的效率低下,不过这里暂时不考虑这个问题。有兴趣的朋友可以一起探讨一下。
上面的第三行代码中的 ViewState["pageindex"] 是用来控制PagedDataSource的当前页的,我们在Page_Load事件中和第三步将要将的函数中来具体讲解如何利用 ViewState["pageindex"]控制当前页。
BindData()函数中后面的部分是控制向前向后按钮的显隐的,不再多说。
第三步,分页控制
第二步中说过利用 ViewState["pageindex"] 来控制当前页,为了在页面加载的时候就显示第一页,我们当然要在Page_load事件中将 ViewState["pageindex"]置为0。
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
ViewState["pageindex"] = "0";
BindData(); }
}
我们需要加两个按钮(Previous、Next)来点击进行分页控制。
asp:DataList ID="dlData" runat="server" RepeatColumns="4"
ItemTemplate
asp:Label ID="lblName" runat="server" /br /
asp:Label ID="lblTime" runat="server" /
/ItemTemplate
/asp:DataList
asp:linkbutton ID="lkPre" OnCommand="IndexChanging" CommandArgument="pre" runat="server" PREVIOUS PAGE/asp:linkbutton
asp:linkbutton ID="lkNext" OnCommand="IndexChanging" CommandArgument="next" runat="server" NEXT PAGE/asp:linkbutton
两个按钮的 OnCommand都是IndexChanging()函数,我们通过CommandArgument(pre和next)来区分到底是向前翻还是向后翻。下面是IndexChanging()函数
protected void IndexChanging(object sender, EventArgs e)
{
string strCommand = ((LinkButton)sender).CommandArgument.ToString();
int pageindex = int.Parse(ViewState["pageindex"].ToString());
if (strCommand == "pre")
{
pageindex = pageindex - 1;
}
else
{
pageindex = pageindex + 1;
}
ViewState["pageindex"] = pageindex;
BindData();
}
至此,我们的分页函数已经写完了。这里还有一些东西没有说,比如显示一共多少条记录,当前第几页,一共多少页以及每一页的页码。相信看懂了上面所说的后这些东西还是容易写出来的。
总结一下,我们在前台写好DataList等待数据,而数据是由PagedDataSource提供的,分页通过我们新加的两个ImageButton来控制ViewState进而达到控制PagedDataSource的CurrentPageIndex来实现的。所以,其实DataList也没干啥事,就是显示了每一页的数据而已。有一点需要说明,PagedDataSource的CurrentPageIndex是从0开始的,这也是为什么在Page_load事件中要讲ViewState置为0而不是1的缘故。
Asp.net提供了三个功能强大的列表控件:DataGrid、DataList和Repeater控件,但其中只有DataGrid控件提供分页功能。相对DataGrid,DataList和Repeater控件具有更高的样式自定义性,所以很多时候我们喜欢使用DataList或Repeater控件来显示数据。
实现DataList或Repeater控件的分页显示有几种方法:
1、写一个方法或存储过程,根据传入的页数返回需要显示的数据表(DataTable)
2、使用PagedDataSource类(位于System.Web.UI.WebControls命名空间里)
本篇文章主要说怎么使用PagedDataSource类实现DataList和Repeater控件的分页显示。DataGrid控件内部也使用了PagedDataSource类,PagedDataSource 类封装 DataGrid 控件的属性,这些属性使 DataGrid 可以执行分页。
PagedDataSource 类的部分公共属性:
AllowCustomPaging 获取或设置指示是否启用自定义分页的值。
AllowPaging 获取或设置指示是否启用分页的值。
Count 获取要从数据源使用的项数。
CurrentPageIndex 获取或设置当前页的索引。
DataSource 获取或设置数据源。
DataSourceCount 获取数据源中的项数。
FirstIndexInPage 获取页中的第一个索引。
IsCustomPagingEnabled 获取一个值,该值指示是否启用自定义分页。
IsFirstPage 获取一个值,该值指示当前页是否是首页。
IsLastPage 获取一个值,该值指示当前页是否是最后一页。
IsPagingEnabled 获取一个值,该值指示是否启用分页。
IsReadOnly 获取一个值,该值指示数据源是否是只读的。
IsSynchronized 获取一个值,该值指示是否同步对数据源的访问(线程安全)。
PageCount 获取显示数据源中的所有项所需要的总页数。
PageSize 获取或设置要在单页上显示的项数。
VirtualCount 获取或设置在使用自定义分页时数据源中的实际项数。
这些属性是否和DataGrid的属性很相似?没错,DataGrid控件就是使用PagedDataSource类来实现数据分页显示的 。下面举个使用PagedDataSource类实现DataList和Repeater控件的分页显示的例子:
public void Page_Load(Object src,EventArgs e)
{
OleDbConnection objConn=new OleDbConnection(@"Provider=Microsoft.Jet.OLEDB.4.0; Data Source=c:\test.mdb");
OleDbDataAdapter objCommand=new OleDbDataAdapter("select * from Users",objConn);
DataSet ds=new DataSet();
objCommand.Fill(ds);
//对PagedDataSource 对象的相关属性赋值
PagedDataSource objPds = new PagedDataSource();
objPds.DataSource = ds.Tables[0].DefaultView;
objPds.AllowPaging = true;
objPds.PageSize = 5;
int CurPage;
//当前页面从Page查询参数获取
if (Request.QueryString["Page"] != null)
CurPage=Convert.ToInt32(Request.QueryString["Page"]);
else
CurPage=1;
objPds.CurrentPageIndex = CurPage-1;
lblCurrentPage.Text = "Page: " + CurPage.ToString();
if (!objPds.IsFirstPage)
lnkPrev.NavigateUrl=Request.CurrentExecutionFilePath + "?Page=" + Convert.ToString(CurPage-1);
if (!objPds.IsLastPage)
lnkNext.NavigateUrl=Request.CurrentExecutionFilePath+ "?Page=" + Convert.ToString(CurPage+1);
//把PagedDataSource 对象赋给Repeater控件
Repeater1.DataSource=objPds;
Repeater1.DataBind();
}
el-table:列表中相同名称的数据实现行合并
使用el-table的 span-method 属性控制合并行, 和 row-class-name 属性控制行样式
handleData : 处理表格数据,将同一名称的数据进行组合
getSpanArr :获取单元格的合并行数
objectSpanMethod :合并单元格
getRowClass :设置表格行的样式类
getRowClass 设置的css样式
objectSpanMethod 原理:对每一个单元格返回一个 [rowSpan, colSpan] 数组, rowSpan 表示当前单元格会展示的行数, colSpan 表示当前单元格会展示的列数,设置为0时当前单元格被消除。
参考文章:
element-ui table :span-method(行合并)
js将数组中的相同项放在毗邻位置
FrontPage2000软件中如何应用表格对网页进行排版?
好处太多了,只要你想设计出像样的网页,就需要有表格。
她起到布局以及固定网页元素的作用。
表格是在网页设计中用的最多的元素,大多数的网页都是使用表格来组织的。利用表格来组织网页内容,可以设计出布局合理、结构协调、美观匀称的网页。我们今天要讲的不是表格在控制页面元素的应用,而是表格边框的一些技法。合理的设置表格边框,有时可以得到你意想不到的效果!本文讲述的内容是细线边框表格的制作,涉及的知识比较基础,仅供新手参考。
一.表格基础:
table:表格的标识符,用来界定表格的范围。table标签的属性:
border:表格边框宽度所占的像素点数。
width和height:指定表格的大小。“width”规定表格的宽度,“height”指定表格的高度。 align:表格与其相邻文字的位置。参数值为left(居左)、center(居中)、和right(居右)。 cellspacing:指定表格各单元格之间的空隙。
cellpadding:指定单元格内容与单元格边界之间的空白距离的大小。
TR:行标签。 TR标签的属性:
align:表示该行中各单元格内容是左对齐(left)、水平居中(center)和右对齐right的。
valign:表示该行中各单元格内容是紧靠上沿儿(top)、垂直居中(middle)和紧靠下沿儿的(bottom)。 TH和TD:都是用来规定单元格内容的,TH规定表头元素的内容(表头元素一般位于每列的首行,用来说明该列的具体数据是关于哪个对象的)。TD规定该单元格的内容。TH和TD标签的所有属性及相应的属性功能是完全一样。
rowspan:表示该单元格所跨的行数。
colspan:表示该单元格所跨的列数。
align 、valign:用法同上。指定单元格内容的位置。
二.用表格制作跨幅细线:
有时候在网页排版时,我们需要一条细线,用图片似乎有点劳师动众了,其实,这个小问题用表格就能搞定。
制作过程:
1、插入一个一行一列的表格。
2、将表格的“cellpadding”“cellspacing”都设置为“0”。
3、将单元格的“bgcolor”设置为“#000000”(当然你也可以设置为其他的颜色,主要取决于你需要什么颜色的细线)“height”设置为“1”
。 4、查看源代码,将td/td中的“ ”去掉就ok了。
原理:这种细线效果其实就是一个高为“1pix”的表格。
三.细线表格
我们常常遇到添加表格边框以区别不同的内容的情况,但将表格边框宽度“border”设置为“1”时,边框又显得过于突出,那么,能不能制作细线边框呢?
制作原理:
1、插入一个一行一列的表格。
2、将表格的“border”、“cellpadding”设置为“0”,“cellspacing”设置为“1”。
3、将表格的“bgcolor”=“#000000”。
4、将单元格的“bgcolor”设置为“#FFFFFF”(当然你也可以设置为其他的颜色,主要取决于你需要什么颜色的边框)。
5、预览页面。
原理:前面已经讲过属性“cellspacing”表示的是单元格与单元格的距离。我们在设置整个表格的背景色时也包含了这个距离间的空白(我们设置的是“1pix”),而设置单元格的背景色时却不包含这个距离间的空白,这样以来,你在浏览器中看到的表格边框线其实就是单元格与单元格的距离所显示的。