在做网页的时候,难免要呈现一些数据到网页中,其中容纳数据的控件有不少,其中自己学习到了Datalist,Repeater,DataGrid。下面一一介绍这几个控件,不过在介绍这几个控件,先说一下怎么绑定数据。
语句:<%# DataBinder.Eval(绑定数据的容器,绑定的字段,绑定数据的格式) %>
<ItemTemplate>
<asp:Label runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.personDate","{0:yyyy-MM-dd}") %>'></asp:Label>
</ItemTemplate>
Repeater容器控件:该控件属于较为简单的控件,在VS中没有为程序员提供可视化的设计界面(我是没找到)。相对来说功能比较少。
该下的模板:
ItemTemplate(普通项模板):该模板内可以添加数据源的每个数据项和控件。
AlternatingItemTemplate(交叉项模板):该模板内可以添加数据源的每个数据项和控件。
HeaderTemplate(页眉模板):可以添加每个数据项和控件,不过该模板存在时,必须和项模板共同呈现数据项。比如项模板呈现的是单数数据项,那么该模板就是偶数数据项。
FooterTemplate(页脚模板):就是我们自定义设计页脚了,可以绑定数据项,也可以添加控件
SeparatorTemplate(项模板):项与项之间的元素,比如直线<hr/>
实例
<ItemTemplate>
<tr border="1">
<td>
<%-- <%#DataBinder .Eval (Container .DataItem ,"pID" )%>--%> <%#DataBinder .Eval (Container .DataItem ,"personName" )%>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<font color="red">
<tr>
<td>
<%#DataBinder .Eval (Container .DataItem ,"pID" )%> <%#DataBinder .Eval (Container .DataItem ,"personName" )%></td>
</tr>
</font>
</AlternatingItemTemplate>
DataList容器控件:这个控件比起Repeater控件要好使,它可以自定义设置模板。
实例
对应网页上的绑定数据代码
<EditItemTemplate >
<asp:LinkButton ID="LinkButton1" runat="server" CommandName ="update">保存</asp:LinkButton>
<asp:LinkButton ID="LinkButton2" runat="server" CommandName ="cancel">取消</asp:LinkButton>
<%#DataBinder.Eval (Container .DataItem,"pID") %>
<%#DataBinder .Eval (Container .DataItem ,"personName") %>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"personAddress") %>'></asp:TextBox>
</EditItemTemplate>
<SelectedItemTemplate>
员工姓名: <%#DataBinder .Eval (Container .DataItem ,"personName") %>
<br />
生日:<%#DataBinder .Eval (Container .DataItem ,"personDate") %><br />住址:<%#DataBinder .Eval (Container .DataItem ,"personAddress") %>
</SelectedItemTemplate>
相应的模板的后台代码
//有按钮的话,无论单击哪个按钮都会触发该事件
protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
{
//选中该项
if (e.CommandName =="select")
{
this.DataList1.SelectedIndex = e.Item.ItemIndex; //绑定要查询到项
this.DataBindToDataList(); <pre name="code" class="html" style="font-size: 13.3333px;"> //封装的绑定数据源到该控件的方法
} }
//编辑是触发该事件,修改按钮的commandname直接到该事件
protected void DataList1_EditCommand(object source, DataListCommandEventArgs e)
{ if(e.CommandName =="edit") this.DataList1.EditItemIndex = e.Item.ItemIndex; //绑定当前要修改的项
this.DataBindToDataList(); //封装的绑定数据源到该控件的方法
}
DataGrid控件:该控件更牛了,有属性生成器,可以直接添加模板列,什么按钮列,模板列,属性生成器帮你搞定。点击左上角的小按钮,就有下面的界面了。
实例
<EditItemTemplate>
<asp:TextBox runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.personDate") %>' ID="txt1"></asp:TextBox>
<asp:CompareValidator ID="CompareValidator1" runat="server" ErrorMessage="日期不合法" ControlToValidate="txt1" Display="Dynamic" Operator="DataTypeCheck" Type="Date"></asp:CompareValidator>
</EditItemTemplate>
<ItemTemplate>
<asp:Label runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.personDate","{0:yy<span style="color:#ff0000;">yy-MM-dd</span>}") %>'></asp:Label> //这里可以自定义格式的。
</ItemTemplate>