Wednesday, 5 September 2012

User Control For DataPager in Gridview and select all rows with one checkbox


<%@ Control Language="C#" AutoEventWireup="true" CodeFile="gridPager.ascx.cs" Inherits="Common_gridPager" %>

<div class="DDPager"  >
<span >
       <asp:Label ID ="lblCount" runat ="server" Text =""   style="margin-left:5px"/>
     
    </span>
    <span class="DDFloatLeft" style= "margin-left:10px" >

        <asp:ImageButton AlternateText="First page" ToolTip="First page" ID="ImageButtonFirst" runat="server" ImageUrl="~/Images/PgFirst.gif" Width="8" Height="9" CommandName="Page" CommandArgument="First" CausesValidation ="false"  />
        &nbsp;

        <asp:ImageButton AlternateText="Previous page" ToolTip="Previous page" ID="ImageButtonPrev" runat="server" ImageUrl="~/Images/PgPrev.gif" Width="5" Height="9" CommandName="Page" CommandArgument="Prev"  CausesValidation ="false"/>
        &nbsp;
        <asp:Label ID="LabelPage" runat="server" Text="Page " AssociatedControlID="TextBoxPage" />

        <asp:TextBox ID="TextBoxPage" runat="server" Columns="5" AutoPostBack="true" ontextchanged="TextBoxPage_TextChanged" Width="20px" CssClass="DDControl" />
        of

        <asp:Label ID="LabelNumberOfPages" runat="server" />
        &nbsp;&nbsp;

        <asp:ImageButton AlternateText="Next page" ToolTip="Next page" ID="ImageButtonNext" runat="server" ImageUrl="~/Images/PgNext.gif" Width="5" Height="9" CommandName="Page" CommandArgument="Next"  CausesValidation ="false" />
        &nbsp;&nbsp;

        <asp:ImageButton AlternateText="Last page" ToolTip="Last page" ID="ImageButtonLast" runat="server" ImageUrl="~/Images/PgLast.gif" Width="8" Height="9" CommandName="Page" CommandArgument="Last" CausesValidation ="false" />
    </span>

    <span class="DDFloatRight">

        <asp:Label ID="LabelRows" runat="server" Text="Results per page:" AssociatedControlID="DropDownListPageSize" />
     
        <asp:DropDownList ID="DropDownListPageSize" runat="server" AutoPostBack="true" CssClass="DDControl" onselectedindexchanged="DropDownListPageSize_SelectedIndexChanged" >
          
            <asp:ListItem Value="5" />
            <asp:ListItem Value="10" />
            <asp:ListItem Value="25" />
            <asp:ListItem Value="50" />
                <asp:ListItem Value="100" />
                       <asp:ListItem Value="200" />
                       <asp:ListItem Value="500" />
                       <asp:ListItem Value="1000" />
                       <asp:ListItem Text="All" Value="1001" />
        </asp:DropDownList>
    </span>
   
    <span style="margin-left:10px">
    <asp:Label ID="lblcountrecord"  runat="server" >
   
    </asp:Label>
   
      </span>
  
</div>

Gridview coding


<head runat="server">
    <title></title>
    <link href="css/screen.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="grd_Event" runat="server" DataSourceID="SqlDataSource1" 
            Height="173px" onrowcreated="grd_Event_RowCreated" Width="850px"
            EmptyDataText="No record exist"
            onselectedindexchanged="grd_Event_SelectedIndexChanged" PageSize="5"
            ShowFooter="True">
            <Columns>
               <asp:TemplateField>
               <HeaderTemplate>
                 <ItemTemplate>
               <asp:CheckBox ID="checbox1" runat="server" AutoPostBack="True"
                         oncheckedchanged="checbox1_CheckedChanged" />
               </ItemTemplate>
               </HeaderTemplate>
               <ItemTemplate>
               <asp:CheckBox ID="checbox2" runat="server" />
               </ItemTemplate>
               </asp:TemplateField>
            </Columns>
        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server"
            ConnectionString="<%$ ConnectionStrings:Silverlight_TestConnectionString %>"
            SelectCommand="SELECT * FROM [emp]"></asp:SqlDataSource>
    </div>
    </form>
</body>
</html>
CSS

             .mGrid { width: 100%; background-color: #fff; margin: 5px 0 10px 0; border: solid 1px #c1c1c1; border-collapse:collapse; }
    .mGrid td { padding: 2px; border: solid 1px #c1c1c1; color: #717171; }
    .mGrid th { padding: 4px 2px; color: #41519A; background-color:#a8dbf6;  }
.mGrid .alt { background: #fcfcfc url(grd_alt.png) repeat-x top; }
.mGrid .pgr {background: #424242 url(grd_pgr.png) repeat-x top; }
    .mGrid .pgr table { margin: 5px 0; }
    .mGrid .pgr td { border-width: 0; padding: 0 6px; border-left: solid 1px #666; font-weight: bold; color: #fff; line-height: 12px; }  
    .mGrid .pgr a { color: #666; text-decoration: none; }
    .mGrid .pgr a:hover { color: #000; text-decoration: none; }

No comments:

Post a Comment