Sunday, July 19, 2015

Set number of rows to display in Gridview according to Dropdown Selection in Asp.net

In this tutorial I am going to explain how to set number of rows to display in Gridview according to Dropdown Selection in Asp.net

Description:

In this tutorial 5 records are displayed in Gridview on page load and pagination is working. I have added a Dropdownlist control to webform and set value 5, 10, 15. When user selects the 10 from dropdown 10 records will be display in Gridview per page and vice versa.

Implementation:
Complete HTML markup of Webform:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <table><tr><td></td><td><asp:DropDownList ID="DropDownList1" runat="server"  AutoPostBack="true">
            <asp:ListItem>--Select--</asp:ListItem>
            <asp:ListItem>5</asp:ListItem>
            <asp:ListItem>10</asp:ListItem>
            <asp:ListItem>15</asp:ListItem>
        </asp:DropDownList></td></tr></table>                

        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" AllowPaging="true" PageSize="5">
            <Columns>
                <asp:BoundField DataField="SudentName" HeaderText="Name" />
                 <asp:BoundField DataField="Fee" HeaderText="Fee" />
                 <asp:BoundField DataField="StudentClass" HeaderText="Class" />
                <asp:BoundField DataField="StudentRollNo" HeaderText="Roll Number" />
            </Columns>
        </asp:GridView>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

Add the namespace
C#:
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
VB:
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration

Write the code to bind the data to Gridview
C#:
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());
    protected void Page_Load(object sender, EventArgs e)
    {
        if(!IsPostBack)
        {
            BindGridview();
        }
    }
    public void BindGridview()
    {
        try
        {
        SqlDataAdapter adp = new SqlDataAdapter("Select * from dbo.Student_Detail", con);
        DataTable dt = new DataTable();
        adp.Fill(dt);
        GridView1.DataSource = dt;
        GridView1.DataBind();
         }
        catch(Exception ex)
        {

        }
    }

VB:
    Private con As New SqlConnection(ConfigurationManager.ConnectionStrings("connection").ToString())
    Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
        If Not IsPostBack Then
            BindGridview()
        End If
    End Sub
    Public Sub BindGridview()
        Try
            Dim adp As New SqlDataAdapter("Select * from dbo.Student_Detail", con)
            Dim dt As New DataTable()
            adp.Fill(dt)
            GridView1.DataSource = dt
            GridView1.DataBind()
        Catch ex As Exception
        End Try
    End Sub

Write the code on Dropdownlist selectIndexChnaged event to change the page size
C#:
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        int size = 0;
        if (DropDownList1.SelectedItem.Text != "--Select--")
        {
            size = int.Parse(DropDownList1.SelectedItem.Value.ToString());
            GridView1.PageSize = size;
            BindGridview();
        }
    }

VB:
Protected Sub DropDownList1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles DropDownList1.SelectedIndexChanged
        Dim size As Integer = 0
        If DropDownList1.SelectedItem.Text <> "--Select--" Then
            size = Integer.Parse(DropDownList1.SelectedItem.Value.ToString())
            GridView1.PageSize = size
            BindGridview()
        End If
    End Sub

Write the code on Gridview PageIndexChanging Event
C#:
protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
    {
        GridView1.PageIndex = e.NewPageIndex;
        BindGridview();
    }

VB:
Protected Sub GridView1_PageIndexChanging(sender As Object, e As GridViewPageEventArgs) Handles GridView1.PageIndexChanging
        GridView1.PageIndex = e.NewPageIndex
        BindGridview()
    End Sub

Build, run the project and check the result.
DEMO:
Set number of rows to display in Gridview according to Dropdown Selection in Asp.net
  In this article we have learn How to set number of rows to display in Gridview according to Dropdown selection in Asp.net using (C#, VB). I hope you enjoyed this article. 

No comments:

Post a Comment