当前位置：首页 > 资讯 > 技术文档

详解ASP.NET-----Repeater数据控件的用法总结

时间：2022-05-18 17:06 编辑：来源：阅读：
扫一扫，手机访问

摘要：详解ASP.NET-----Repeater数据控件的用法总结

[b]一、Repeater控件的用法流程及实例：[/b] 1、首先建立一个网站，新建一个网页index.aspx。 2、添加或者建立APP_Data数据文件，然后将用到的数据库文件放到APP_Data文件夹中。 3、打开数据库企业管理器，数据库服务器为local（.），然后将APP_Data文件夹中的数据库附加到数据库服务器中。 4、添加Ling to SQL类。 5、打开视图，服务器资源管理器，右击数据库服务器，选择添加连接，然后选择数据库服务器、数据库类型，及数据库表，然后完成。 6、将需要用到的表，全部选中，然后拖动到.dbml为后缀的文件中，然后保存。到这一步，数据表的附加及与网站的连接就完成了。 [b]目标：[/b]通过使用Repeater数据控件，让数据表中的数据在表格中显示。 1、添加样式文件，然后在样式文件中，书写表格的样式代码。 2、在index.aspx的设计模式下，插入表格，通常插入两行（一行为标题行，一行为内容行），因为Repeater控件会自动循环的。然后在源代码界面中，将刚插入的表格的第一行的单元格改为，标题单元格，即将<td>改为<th>。 3、选中表格，然后选择格式，然后选择附加样式表。接下来，需要将源代码中的头部中样式代码删除，将行样式删除，并且书写新建的样式表中的类或这ID到表格中。 4、然后，将光标放到table前面，双击repeater控件，这样Repeater控件的代码就添加到了Table代码的前面，然后分别为Repeater控件添加头部模版（<HeaderTemplate></HeaderTemplate> ）、列表模版（<ItemTemplate></ItemTemplate>）和尾部模版（ <FooterTemplate> </FooterTemplate>）。 [b]注意：[/b] 头部模版放置表格开始及第一行标题行(<table><tr><th></th></tr>)；列表模版放置表格第二行(<tr></tr>)；尾部模版放置表个结束（</table>）。插入表格时只需插入两行即可，显示数据时是根据数据库表循环显示的。项目模板，会进行循环显示，放置表格第二行。 5、然后在标题行的单元格中书写将要显示的数据库中字段的别名，在内容行的单元格中书写数据库中的字段名，方式为：

<td><%#Eval("数据库字段名") %></td>

核心代码为：

<body>
  <form id="form1" runat="server">
  <div>
  <!--光标放到table前面，双击repeater控件，三个缺一不可-->
    <asp:Repeater ID="Repeater1" runat="server">
    <HeaderTemplate><!--头部模板,放表格开始及第一行标题-->
    <table class="ts"><!--插入表格时只需插入两行即可，显示数据时是根据数据库表循环显示的-->
      <tr>
        <th>
          学号</th>
        <th>
          姓名</th>
        <th>
          性别</th>
        <th>
          籍贯</th>
        <th>
          年龄</th>
      </tr></HeaderTemplate>  
    <ItemTemplate><!--项目模板，会进行循环显示，放置表格第二行-->
    <tr>
        <td>
          <%#Eval("number") %> <!--HTMl中插入其他代码需要用<% %>括起来，Eval("数据库中的字段名")-->
          </td>
        <td>
         <%#Eval("name")%> </td>
        <td>
          <%#Eval("sex")%> </td>
        <td>
           <%#Eval("place")%></td>
        <td>
          <%#Eval("age")%> </td>
      </tr>
    </ItemTemplate>    
    <FooterTemplate><!--底部模板-->
    </table>    <!--表格结束部分-->
    </FooterTemplate>  
    </asp:Repeater>
  </div>
  </form>
</body>

注意： HTMl中插入其他代码需要用<% %>括起来。 6、然后在index.aspx.cs的Page_Load（）事件中绑定数据源。核心代码为：

public partial class citynumber : System.Web.UI.Page
{
  DataClassesDataContext dc = new DataClassesDataContext();
  protected void Page_Load(object sender, EventArgs e)
  {

    var query = from c in dc.city select c;
    Repeater1.DataSource = query;
    Repeater1.DataBind();
  }
}

7、运行index.aspx页面即可看到数据库中各字段信息。 [b]二、通过Table显示数据库中的字段时，为字段添加超链接。[/b] 1、新建两个页面，index.aspx 页面和Cities.aspx页面。 index.aspx页面代码：

<body>
  <asp:Repeater ID="Repeater1" runat="server">
  <HeaderTemplate>
  <table class="ts">
    <tr>
      <th>
        省份名称</th>
      <th>
        省份编号</th>
    </tr>
  </HeaderTemplate>
  <ItemTemplate>
  <tr>
      <td>
        <a href='Cities.aspx?pro=<%#Eval("proID") %>' target="_blank"><%#Eval("proName") %></a></td><!--添加超链接，超链接放到内容的两边-->
      <td>
      <%#Eval("proID")%></td>
    </tr>
  </ItemTemplate>
  <FooterTemplate>
  </table>
  </FooterTemplate>
  </asp:Repeater>
  <form id="form1" runat="server">
  <div>
  </div>
  </form>
</body>

index.aspx.cs中的代码：

public partial class index : System.Web.UI.Page
{
  DataClassesDataContext dc = new DataClassesDataContext();
  protected void Page_Load(object sender, EventArgs e)
  {

    var query = from c in dc.province select c;
    Repeater1.DataSource = query;
    Repeater1.DataBind();
  }
}

Cities.aspx页面中的代码：

<body>
  <form id="form1" runat="server">
  <div>
  
    <asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" 
      GridLines="None" Width="909px">
      <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
      <RowStyle BackColor="#EFF3FB" />
      <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
      <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
      <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
      <EditRowStyle BackColor="#2461BF" />
      <AlternatingRowStyle BackColor="White" />
    </asp:GridView>
  
  </div>
  </form>
</body>

Cities.aspx.cs页面中的代码：

public partial class Cities : System.Web.UI.Page
{
  DataClassesDataContext dc = new DataClassesDataContext();
  protected void Page_Load(object sender, EventArgs e)
  {
    int id =Convert.ToInt32(Request.QueryString["pro"].ToString());
    var query = from c in dc.city where c.proID == id select c;
    GridView1.DataSource = query;
    GridView1.DataBind();

  }
}

然后运行index.aspx页面，通过单击超链接就跳转到了Cities.aspx，在该页面显示信息。以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程素材网。

全部评论(0)

上一篇：C#隐式/显示实现接口方法详解
下一篇：asp.net 取消缓存相关问题说明

资讯排行榜
更多>>