Wednesday, April 24, 2013

Use Of Repeater Control in ASP.NET


Introduction


A Repeater is a Data-bound control. Data-bound controls are container controls. It creates a link between the Data Source and the presentation UI to display the data. The repeater control is used to display a repeated list of items.

A Repeater has five inline templates to format it:
  1. <HeaderTemplate>
  2. <AlternatingItemTemplate>
  3. <Itemtemplate>
  4. <SeperatorTemplate>
  5. <FooterTemplate>
<HeaderTemplate>
Displays Header text for a Data Source collection and applies a different style for the Header text.
<AlternatingItemTemplate>
Changes the background color or style of alternating items in a Data Source collection.
<Itemtemplate>
It defines how the each item is rendered from the Data Source collection.
<SeperatorTemplate>
It will determine the separator element that separates each item in the item collection. It will be a <br> or <Hr> HTML element.
<FooterTemplate>
Displays a footer element for the Data Source collection.
Now, in this article I am describing the Repeater control in ASP.NET and how to create a comment page in ASP.NET.

First I created a database "EmpDetail". Then I created a table in the database. 

Table Query

CREATE TABLE [dbo].[Comment](
       [UserName] [nvarchar](50) NULL,
       [Subject] [nvarchar](max) NULL,
       [CommentOn] [nvarchar](max) NULL,
       [Post_Date] [datetime] NULL
) ON [PRIMARY]

Complete Program
Repeter_Control_Example.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;

public partial class Repeter_Control_Example : System.Web.UI.Page
{
   
    SqlCommand cmd;
    SqlDataAdapter da;
    DataSet ds;

SqlConnection con = new SqlConnection("Data Source=.;Initial Catalog=EmpDetail;Persist Security Info=True;User ID=sa;Password=****");

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            RepeterData();
        }
    }
    protected void btnSubmit_click(object sender, EventArgs e)
    {
        try
        {
           con.Open();
cmd=new SqlCommand("insert into Comment       
(UserName,Subject,CommentOn,Post_Date) values(@userName,@subject,@comment,@date)", con);
   cmd.Parameters.Add("@userName", SqlDbType.NVarChar).Value = txtName.Text.ToString();
   cmd.Parameters.Add("@subject", SqlDbType.NVarChar).Value = txtSubject.Text.ToString();
    cmd.Parameters.Add("@comment", SqlDbType.NVarChar).Value = txtComment.Text.ToString();
    cmd.Parameters.Add("@date", SqlDbType.DateTime).Value = DateTime.Now.Date;
            cmd.ExecuteNonQuery();
            con.Close();
            txtName.Text = string.Empty;
            txtSubject.Text = string.Empty;
            txtComment.Text = string.Empty;
            RepeterData();

        }
        catch(Exception ex)
            {
               txtComment.Text= ex.Message;
            }

    }
    public void RepeterData()
    {
        con.Open();
        cmd = new SqlCommand("Select * from Comment Order By Post_Date desc", con);
        DataSet ds = new DataSet();
        da = new SqlDataAdapter(cmd);
        da.Fill(ds);
        RepterDetails.DataSource = ds;
        RepterDetails.DataBind();

    }
}

Repeter_Control_Example.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Repeter_Control_Example.aspx.cs" Inherits="Repeter_Control_Example" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <h3>Repeter Control in ASP.NET</h3>
    <div">
    <table>
    <tr>
    <td>Enter Name:</td>
    <td><asp:TextBox ID="txtName" runat="server"></asp:TextBox></td>
    </tr>
      <tr>
    <td>Enter Subject:</td>
    <td><asp:TextBox ID="txtSubject" runat="server"></asp:TextBox></td>
    </tr>
      <tr>
    <td valign="top">Enter Comments:</td>
    <td><asp:TextBox ID="txtComment" runat="server" Rows="5" Columns="20" TextMode="MultiLine"></asp:TextBox></td>
    </tr>
      <tr>
    <td></td>
    <td><asp:Button ID="btnSubmit" runat="server" Text="Summit" OnClick="btnSubmit_click" /></td>
    </tr>
    </table>
    </div>
    <div>
    <asp:Repeater ID="RepterDetails" runat="server">
    <HeaderTemplate>
    <table style="border:1px solid #0000FF; width:500px" cellpadding="0">
    <tr style="background-color:#FF6600; color:#000000; font-size: large; font-weight: bold;">
    <td colspan="2">
    <b>Comments</b>
    </td>
    </tr>
    </HeaderTemplate>
    <ItemTemplate>
    <tr style="background-color:#EBEFF0">
    <td>
    <table style="background-color:#EBEFF0;border-top:1px dotted #df5015; width:500px" >
    <tr>
    <td >
    Subject:
    <asp:Label ID="lblSubject" runat="server" Text='<%#Eval("Subject") %>' Font-Bold="true"/>
    </td>
    </tr>
    </table>
    </td>
    </tr>
    <tr>
    <td>
  <asp:Label ID="lblComment" runat="server" Text='<%#Eval("CommentOn") %>'/>
    </td>
    </tr>
    <tr>
    <td>
<table style="background-color:#EBEFF0;border-top:1px dotted #df5015;border-bottom:1px solid #df5015; width:500px" >
    <tr>
 <td>Post By: <asp:Label ID="lblUser" runat="server" Font-Bold="true"                                Text='<%#Eval("UserName") %>'/></td>
<td >Created Date:<asp:Label ID="lblDate" runat="server" Font-Bold="true"                             Text='<%#Eval("Post_Date") %>'/></td>
    </tr>
    </table>
    </td>
    </tr>
    <tr>
    <td colspan="2">&nbsp;</td>
    </tr>
    </ItemTemplate>
    <FooterTemplate>
    </table>
    </FooterTemplate>
    </asp:Repeater>
    </div>
    </form>
</body>
</html>

Output

RepeterExample.gif

No comments:

Post a Comment

Kashmir 370 and 35A : The Wound of india

क्या है जम्मू-कश्मीर में लागू धारा 370,35A पूर्ण विवरण Know about 370 act in Jammu एक बार फिर से राजनीति गलियारे में धारा 370,35A को ल...