Summary of ASP. NET ----- Repeater data control usage,
I. usage process and example of the Repeater control:
1. Create a website and create a webpage index. aspx.
2. Add or create an APP_Data data file and put the database files used in the APP_Data folder.
3. Open the Database Enterprise Manager, the database server is local (.), and then attach the database in the APP_Data folder to the database server.
4. Add the Ling to SQL class.
5. Open View, server resource manager, right-click Database Server, select Add connection, select database server, database type, and database table, and then complete.
6. Select all the tables to be used, drag them to the file with the. dbml suffix, and save them. In this step, the data table is appended and connected to the website.
Objectives:You can use the Repeater Data Control to display data in a data table.
1. Add a style file and write the style code of the table in the style file.
2. In the design mode of index. aspx, insert a table. Usually insert two rows (one row is the title row and one row is the content row) because the Repeater control automatically loops. On the source code page, change the cell in the first row of the inserted Table to the title cell, that is, change <td> to <th>.
3. Select a table, select a format, and then select an additional style sheet. Next, you need to delete the style code in the header in the source code, delete the row style, and write the class or the ID in the newly created style table to the table.
4. Place the cursor in front of the table and double-click the repeater control. In this way, the code of the Repeater control is added to the front of the Table code, add the header template (<HeaderTemplate> </HeaderTemplate>) and list template (<ItemTemplate> </ItemTemplate>) for the Repeater control respectively) and the tail template (<FooterTemplate> </FooterTemplate> ).
Note:
Place the table in the header template and the header row in the first row (<table> <tr> <th> </tr> ); the list template is placed in the second row of the table (<tr> </tr>); the ending table is placed in the tail template (</table> ).
When you insert a table, you only need to insert two rows. The displayed data is displayed cyclically according to the database table. The project template is displayed cyclically and placed in the second row of the table.
5. Then, write the alias of the fields in the database to be displayed in the cell of the row title, and write the field name in the database in the cell of the row content:
<Td> <% # Eval ("database field name") %> </td>
The core code is:
<Body> <form id = "form1" runat = "server"> <div> <! -- Place the cursor in front of the table and double-click the repeater control. The three controls are indispensable. --> <asp: Repeater ID = "Repeater1" runat = "server"> <HeaderTemplate> <! -- Header template, where the table starts and the header of the first row --> <table class = "ts"> <! -- Insert only two rows into the table, the data is displayed cyclically based on the database table --> <tr> <th> Student ID </th> <th> name </th> <th> gender </th> <th> nationality </th> <th> age </th> </tr> </HeaderTemplate> <ItemTemplate> <! -- The project template is displayed cyclically and placed in the second row of the table --> <tr> <td> <% # Eval ("number") %> <! -- Other code inserted in HTMl must be included in <%>, Eval ("field name in Database ") --> </td> <% # Eval ("name") %> </td> <% # Eval ("sex ") %> </td> <% # Eval ("place") %> </td> <% # Eval ("age ") %> </td> </tr> </ItemTemplate> <FooterTemplate> <! -- Bottom template --> </table> <! -- End part of the table --> </FooterTemplate> </asp: Repeater> </div> </form> </body>
Note:
Other codes inserted in HTMl must be included in <%>.
6. Bind the data source to the index. aspx. cs Page_Load () event.
The core code is:
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. Run the index. aspx page to view information about fields in the database.
2. Add a hyperlink to the field when the field in the database is displayed through the Table.
1. Create two pages, index. aspx and Cities. aspx.
Index. aspx page code:
<Body> <asp: repeater ID = "Repeater1" runat = "server"> <HeaderTemplate> <table class = "ts"> <tr> <th> province name </th> <th> province ID </th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td> <a href = 'cities. aspx? Pro = <% # Eval ("proID") %> 'target = "_ blank"> <% # Eval ("proName ") %> </a> </td> <! -- Add a hyperlink and place it on both sides of the content --> <td> <% # Eval ("proID ") %> </td> </tr> </ItemTemplate> <FooterTemplate> </table> </FooterTemplate> </asp: repeater> <form id = "form1" runat = "server"> <div> </form> </body>
Code in 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(); }}
Code on the Cities. aspx page:
<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>
Code on the Cities. aspx. cs page:
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(); }}
Run the index. aspx page and click the hyperlink to jump to Cities. aspx. The page displays information.
The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
