大家可能都對(duì)datagrid比較熟悉，但是如果在數(shù)據(jù)量大的時(shí)候，我們就得考慮使用repeater作為我們的數(shù)據(jù)綁定控件了。repeater控件與datagrid (以及datalist)控件的主要區(qū)別是在于如何處理html。asp.net建立html代碼以顯示datagrid控件，但repeater允許開發(fā)人員決定如何顯示數(shù)據(jù)。所以，你可以選擇將數(shù)據(jù)顯示在一個(gè)html表格中或者一個(gè)順序列表中。這主要取決于你的選擇，但你必須將正確的html插入到 asp.net頁(yè)面中。

模板與datalist一樣，repeater控件只支持模板。以下的模板可供選擇：

alternatingitemtemplate: 指定如何顯示每一其它選項(xiàng)。

itemtemplate: 指定如何顯示選項(xiàng)。(alternatingitemtemplate可以覆蓋這一模板。)

headertemplate: 建立如何顯示標(biāo)題。

footertemplate: 建立如何顯示頁(yè)腳。

separatortemplate: 指定如何顯示不同選項(xiàng)之間的分隔符。

你可以使用這些模板來顯示你希望的數(shù)據(jù)。唯一具有強(qiáng)制性的模板是itemtemplate，所有其它的模板都是具有選擇性的。

對(duì)于處理一個(gè)數(shù)據(jù)源，repeater控件具有與datagrid與datalist相同的屬性：

datamember：獲得或者設(shè)置與 repeater 控件綁定的相應(yīng)datasource屬性的表格。

datasource：獲得或者設(shè)置為 repeater 顯示提供數(shù)據(jù)的數(shù)據(jù)源。

除此之外，還有一個(gè)items屬性，你可以通過這一屬性編程訪問repeater數(shù)據(jù)中單一選項(xiàng)。它返回一個(gè)repeateritemcollection對(duì)象，為一組repeateritem對(duì)象的集合，代表 repeater 數(shù)據(jù)的每一行。

asp.net web數(shù)據(jù)控件還有其它一個(gè)共性：它們都使用databind方法來生成用戶界面。調(diào)用這一方法可以返回并顯示數(shù)據(jù)(假設(shè)datasource和 datamember屬性設(shè)置正確)。在查看databind方法之前，我們先看看如何在一個(gè)web頁(yè)面中使用一個(gè)repeater控件。

使用repeater控件

使用repeater控件的第一步驟是決定我們將要使用的數(shù)據(jù)源和字段。例如，我們將要使用sql server northwind數(shù)據(jù)庫(kù)中的employees列表。web頁(yè)面將顯示職工的完整名字，地址，以及電話號(hào)碼。html將使用div標(biāo)記，用 repeater 模板來分隔內(nèi)容。下面是 web 頁(yè)面的 html 內(nèi)容：

前臺(tái)代碼

代碼如下:

<asp:repeater id=repeater1 runat=server>

<headertemplate><table cellpadding=0 cellspacing=0 border=1 align=center class=auto-style1>

<tr align=left>

<th>編號(hào)</th>

<th>姓名</th>

<th>年齡</th>

<th>班級(jí)</th>

<th>零花</th>

</tr>

</headertemplate>

<itemtemplate>

<tr >

<td><%#eval(id)%></td>

<td><%#eval(name)%></td>

<td><%#eval(age)%></td>

<td><%#eval(classid)%></td>

<td><%#eval(salary)%></td>

</tr>

</itemtemplate>

<footertemplate></table></footertemplate>

</asp:repeater>

后臺(tái)代碼

代碼如下:

string sql = string.format(select * from person);

datatable dt = sqlhelper.helper.executequery(sql);

repeater1.datasource = dt;

repeater1.databind();

aspnetpager的使用方法：

首先注冊(cè)<%@ register assembly=aspnetpager namespace=wuqi.webdiyer tagprefix=webdiyer %>

前臺(tái)：

代碼如下:

<webdiyer:aspnetpager id=aspnetpager1 runat=server custominfohtml=第%currentpageindex%頁(yè)，共%pagecount%頁(yè)，每頁(yè)%pagesize%條

firstpagetext=首頁(yè) lastpagetext=尾頁(yè) layouttype=table nextpagetext=下一頁(yè)

onpagechanging=aspnetpager1_pagechanging pageindexboxtype=dropdownlist

pagingbuttonlayouttype=span prevpagetext=上一頁(yè) showcustominfosection=left

showpageindexbox=always submitbuttontext=go textafterpageindexbox=頁(yè)

textbeforepageindexbox=轉(zhuǎn)到 width=450px pagesize=3>

</webdiyer:aspnetpager>

后臺(tái)：

代碼如下:

private void addpages(repeater rpt,wuqi.webdiyer.aspnetpager anp,datatable dt)

{

pageddatasource pds = new pageddatasource();

pds.allowpaging = true;

pds.datasource = dt.defaultview;

anp.recordcount = dt.rows.count;//給分頁(yè)控件指定當(dāng)前總數(shù)

pds.pagesize = anp.pagesize;//確定分頁(yè)，每頁(yè)有n項(xiàng)

pds.currentpageindex = anp.currentpageindex - 1;//確定當(dāng)前頁(yè)數(shù)

rpt.datasource = pds;//綁定數(shù)據(jù)源

rpt.databind();

}

protected void aspnetpager1_pagechanging(object src, wuqi.webdiyer.pagechangingeventargs e)

{

aspnetpager1.currentpageindex = e.newpageindex;

bindpersondata();

}

例子

repeater控件動(dòng)態(tài)添加、刪除一行

代碼如下:

<script type=text/javascript>

var txtequipmentidsidarray = new array();

function openwindow(clientid, typeid, reqnum) {

var url = ../equipmentissue/equipmentrequestissue.aspx?typeid= + typeid + &reqnum= + reqnum;

var widths = 600;

var heigths = 450;

var winpar = window.showmodaldialog(url, window, 'dialogwidth=' + widths + 'px;dialogheight=' + heigths + 'px;status=no;center=yes;scroll=no;help:no;');

if (winpar != undefined) {

var txtequipmentids = document.getelementbyid(clientid);

txtequipmentids.value = winpar;

// //審批用戶控件中保存發(fā)放的equipmentid

// var isexistequipmentidsid = false;

// for (var i = 0; i < txtequipmentidsidarray.length; i++) {

// if (txtequipmentidsidarray[i] == clientid) {

// isexistequipmentidsid = true;

// }

// }

// if (isexistequipmentidsid == false) {

// txtequipmentidsidarray.push(clientid);

// }

// var tempequipmentid = ;

// for (var i = 0; i < txtequipmentidsidarray.length; i++) {

// tempequipmentid = tempequipmentid + document.getelementbyid(txtequipmentidsidarray[i]).value;

// var hiddenequipmentids = document.getelementbyid(uc_approvalaction1_hfequipmentids);

// hiddenequipmentids.value = tempequipmentid;

// }

// //alert(hiddenequipmentids.value);

}

var tempreturnvalue = ;

var tb_request = document.getelementbyid(tb_request);

var tr = tb_request.getelementsbytagname(tr);

for (var i = 0; i < tr.length; i++) {

if (tr[i].id != ) {

var span_equrequestitemid = tr[i].getelementsbytagname(span); //獲取申請(qǐng)明細(xì)的idequrequestitemid

var select_ddlstation; //獲取使用工位stationid

var option = tr[i].getelementsbytagname(select)[1].getelementsbytagname(option);

for (var j = 0; j < option.length; j++) {

if (option[j].selected)

{

select_ddlstation = option[j]

}

}

var textarea_equipmentids = tr[i].getelementsbytagname(textarea); //獲取發(fā)放的資產(chǎn)號(hào)equipmentno

tempreturnvalue = tempreturnvalue + span_equrequestitemid[0].innertext + : + select_ddlstation.value + : + textarea_equipmentids[0].innertext + |;

}

}

var hiddenequipmentids = document.getelementbyid(uc_approvalaction1_hfequipmentids);

hiddenequipmentids.value = tempreturnvalue;

//alert(hiddenequipmentids.value);

}

</script>

repeater:

代碼如下:

<div id=div_repeater>

<asp:hiddenfield id=hfrptcolumns runat=server value=guid,equrequestitemid,equipmenttype,station,equipmentnum,equipmentids />

<table id=tb_request cellpadding=1 cellspacing=0 width=100% style=background-color: #dfe8f6; font-size:12px; padding:10px;>

<thead>

<tr>

<th>序號(hào)</th>

<th>明細(xì)編號(hào)</th>

<th>

資產(chǎn)類型

</th>

<th>

使用工位

</th>

<th>

申請(qǐng)數(shù)量

</th>

<th>

發(fā)放的資產(chǎn)號(hào)<font color=red>(資產(chǎn)管理員填寫)</font>

</th>

</tr>

</thead>

<tbody>

<asp:repeater id=rptrequest runat=server onitemcommand=rptrequest_itemcommand

onitemdatabound=rptrequest_itemdatabound>

<itemtemplate>

<tr id=tr_request>

<td>

<%# container.itemindex+1 %>

<asp:label id=lblguid runat=server text='<%#eval(guid) %>' visible=false></asp:label>

</td>

<td><asp:label id=lblequrequestitemid runat=server text='<%#eval(equrequestitemid) %>'></asp:label></td>

<td>

<asp:dropdownlist id=ddlequipmenttype runat=server></asp:dropdownlist>

<asp:label id=lblequipmenttype runat=server text='<%#eval(equipmenttype) %>' visible=false></asp:label>

</td>

<td>

<asp:dropdownlist id=ddlstation runat=server></asp:dropdownlist>

<asp:label id=lblstation runat=server text='<%#eval(station) %>' visible=false></asp:label>

</td>

<td><asp:textbox id=txtreqequipmentnum runat=server text='<%#eval(equipmentnum) %>'></asp:textbox></td>

<td><asp:textbox id=txtequipmentids runat=server text='<%#eval(equipmentids) %>' textmode=multiline></asp:textbox></td>

<td><asp:button id=btnaddrow runat=server text=新增一行 commandname=add />

&nbsp;&nbsp;&nbsp;&nbsp;<asp:button id=btndeleterow runat=server text=刪除本行 commandname=delete /></td>

</tr>

</itemtemplate>

</asp:repeater>

</tbody>

</table>

</div>

后臺(tái)：

代碼如下:

/// <summary>

/// 綁定repeater的數(shù)據(jù)源

/// </summary>

private void repeaterbinddata()

{

datatable dt = definedatatableschema(hfrptcolumns.value);

if (request[businessno] == null)

{

loaddata(dt);

}

else

{

loaddata(request[businessno].tostring(), dt);

}

rptrequest.datasource = dt;

rptrequest.databind();

}

private void loaddata(string businessno, datatable dt)

{

string strsql = select * from ems_equipmentrequestitem where bussinessno = '+ businessno +';

datatable dt_equipmentrequestitem = dbutility.dbhelpersql.query(strsql).tables[0];

//for (int i = 0; i < dt_equipmentrequestitem.rows.count; i++)

foreach (datarow dr in dt_equipmentrequestitem.rows)

{

datarow row = dt.newrow();

row[guid] = guid.newguid();

row[equrequestitemid] = dr[equrequestitemid].tostring();

row[equipmenttype] = dr[typeid].tostring();

row[station] = dr[stationid].tostring();

row[equipmentnum] = dr[equipmentnum].tostring();

row[equipmentids] = dr[equipmentids].tostring();

dt.rows.add(row);

}

}

/// <summary>

/// repeater數(shù)據(jù)默認(rèn)加載

/// </summary>

/// <param name=dt></param>

private void loaddata(datatable dt)

{

//默認(rèn)顯示1行

for (int i = 0; i < 1; i++)

{

datarow row = dt.newrow();

dt.rows.add(row);

}

//為第一行加載一些數(shù)據(jù)

datarow row0 = dt.rows[0];

row0[guid] = guid.newguid();

row0[equrequestitemid] = ;

row0[equipmenttype] = ;

row0[station] = ;

row0[equipmentnum] = 1;//默認(rèn)初始為1

row0[equipmentids] = ;

}

/// <summary>

/// 根據(jù)repeater相對(duì)應(yīng)的列名，定義數(shù)據(jù)源datatable的schema

/// </summary>

/// <param name=columns>列名</param>

/// <returns></returns>

public datatable definedatatableschema(string columns)

{

datatable dt = new datatable();

string[] columnsary = columns.split(',');

foreach (string str in columnsary)

{

dt.columns.add(str);

}

return dt;

}

protected void rptrequest_itemcommand(object source, repeatercommandeventargs e)

{

if (e.commandname == add)

{

system.web.ui.webcontrols.label lblguid = (system.web.ui.webcontrols.label)e.item.findcontrol(lblguid);

//首先，恢復(fù)數(shù)據(jù)源

datatable dt = definedatatableschema(hfrptcolumns.value);

foreach (repeateritem item in rptrequest.items)

{

datarow newrow = dt.newrow();

newrow[guid] = ((system.web.ui.webcontrols.label)item.findcontrol(lblguid)).text;

newrow[equrequestitemid] = ((system.web.ui.webcontrols.label)item.findcontrol(lblequrequestitemid)).text;

newrow[equipmenttype] = ((dropdownlist)item.findcontrol(ddlequipmenttype)).selectedvalue;

newrow[station] = ((dropdownlist)item.findcontrol(ddlstation)).selectedvalue;

newrow[equipmentnum] = ((textbox)item.findcontrol(txtreqequipmentnum)).text;

newrow[equipmentids] = ((textbox)item.findcontrol(txtequipmentids)).text;

dt.rows.add(newrow);

if (lblguid.text == ((system.web.ui.webcontrols.label)item.findcontrol(lblguid)).text)

{

//添加一行

datarow row = dt.newrow();

row[guid] = guid.newguid();

row[equipmenttype] = ;

row[station] = ;

row[equipmentnum] = 1;//默認(rèn)初始為1

row[equipmentids] = ;

dt.rows.add(row);

}

}

rptrequest.datasource = dt;

rptrequest.databind();

}

else if (e.commandname == delete)

{

system.web.ui.webcontrols.label lblguid = (system.web.ui.webcontrols.label)e.item.findcontrol(lblguid);

//首先，恢復(fù)數(shù)據(jù)源

datatable dt = definedatatableschema(hfrptcolumns.value);

foreach (repeateritem item in rptrequest.items)

{

if (lblguid.text != ((system.web.ui.webcontrols.label)item.findcontrol(lblguid)).text)

{

datarow newrow = dt.newrow();

newrow[guid] = ((system.web.ui.webcontrols.label)item.findcontrol(lblguid)).text;

newrow[equrequestitemid] = ((system.web.ui.webcontrols.label)item.findcontrol(lblequrequestitemid)).text;

newrow[equipmenttype] = ((dropdownlist)item.findcontrol(ddlequipmenttype)).selectedvalue;

newrow[station] = ((dropdownlist)item.findcontrol(ddlstation)).selectedvalue;

newrow[equipmentnum] = ((textbox)item.findcontrol(txtreqequipmentnum)).text;

newrow[equipmentids] = ((textbox)item.findcontrol(txtequipmentids)).text;

dt.rows.add(newrow);

}

}

rptrequest.datasource = dt;

rptrequest.databind();

}

}

protected void rptrequest_itemdatabound(object sender, repeateritemeventargs e)

{

if (e.item.itemtype == listitemtype.item || e.item.itemtype == listitemtype.alternatingitem)

{

dropdownlist ddlequipmenttype_temp = e.item.findcontrol(ddlequipmenttype) as dropdownlist;

string sqlstr = @select distinct b.typeid,b.equipmentname + '_' + b.equipmenttype as 'equipmentname_equipmenttype'

from ems_equipmentinfo a

join ems_equipmenttype b on a.typeid = b.typeid and b.status = '1'

order by equipmentname_equipmenttype;

dataset ds = dbutility.dbhelpersql.query(sqlstr);

ddlequipmenttype_temp.datatextfield = equipmentname_equipmenttype;

ddlequipmenttype_temp.datavaluefield = typeid;

ddlequipmenttype_temp.datasource = ds;

ddlequipmenttype_temp.databind();

ddlequipmenttype_temp.selectedvalue = (e.item.findcontrol(lblequipmenttype) as system.web.ui.webcontrols.label).text;

dropdownlist ddlstation_temp = e.item.findcontrol(ddlstation) as dropdownlist;

string sqlstr2 = @select nodeid,line + '_' + stationname as 'line_stationname' from v_stations where status='1' order by line_stationname;

dataset ds2 = dbutility.dbhelpersql.query(sqlstr2);

ddlstation_temp.datatextfield = line_stationname;

ddlstation_temp.datavaluefield = nodeid;

ddlstation_temp.datasource = ds2;

ddlstation_temp.databind();

ddlstation_temp.selectedvalue = (e.item.findcontrol(lblstation) as system.web.ui.webcontrols.label).text;

textbox txtequids = e.item.findcontrol(txtequipmentids) as textbox;

txtequids.attributes.add(readonly, true);

if (request[businessno] != null)

{

(e.item.findcontrol(btnaddrow) as system.web.ui.webcontrols.button).visible = false;

(e.item.findcontrol(btndeleterow) as system.web.ui.webcontrols.button).visible = false;

string businessno = request[businessno].tostring();

bool isapplyuser = is_applyuser(session[currentuserid].tostring(), businessno, ems_equipmentrequest, requester);//是否為申請(qǐng)人本人

if (isapplyuser == true)

{

string requeststatus = httputility.urldecode(request[requeststatus].tostring(), system.text.encoding.utf8);//申請(qǐng)單的當(dāng)前狀態(tài)

if (requeststatus == 草稿 || requeststatus == 退回)

{

(e.item.findcontrol(btnaddrow) as system.web.ui.webcontrols.button).visible = true;

(e.item.findcontrol(btndeleterow) as system.web.ui.webcontrols.button).visible = true;

}

}

else

{

bool iscurrentappprovaler = is_currentappprovaler(session[currentuserid].tostring(), businessno);//是否為當(dāng)前能做審批的人

if (iscurrentappprovaler == true)

{

string sql = select top 1 layername from ems_approvaler where bussinessno=' + businessno + '

+ and approvalstatus='n' order by appsequence ;

datatable dt = dbutility.dbhelpersql.query(sql).tables[0];

if (dt.rows.count != 0 && dt.rows[0][layername].tostring() == 資產(chǎn)管理員)

{

string reqnum = (e.item.findcontrol(txtreqequipmentnum) as textbox).text.trim();

txtequids.attributes.add(onclick, openwindow(' + txtequids.clientid + ',' + ddlequipmenttype_temp.selectedvalue + ',' + reqnum + '));

}

}

}

}

}

}

更多信息請(qǐng)查看IT技術(shù)專欄