GridView with Buttons ASP.NET C#

ASH

10 years ago

GridView with Buttons ASP.NET C#

First make a gridview in your .aspx page (Design page)

Here’s my code :

<asp:GridView runat="server" ID="datagridview" CssClass="mydatagrid" AllowPaging="True"
CellPadding="4" ForeColor="#333333" GridLines="None" BorderColor="#003300" BorderStyle="Solid"
BorderWidth="1px" Font-Size="11pt" Font-Names="Century" OnPageIndexChanging="datagridview_PageIndexChanging"
OnRowCommand="datagridview_RowCommand">
<RowStyle BackColor="#EFF3FB" BorderColor="Black" BorderWidth="1px" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<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" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" />
<AlternatingRowStyle BackColor="White" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" />
<Columns>
<asp:ButtonField ButtonType="Button" HeaderText="ClickHere" Text="ViewDetails" CommandName="ViewDetails"
ControlStyle-BackColor="#507CD1" ControlStyle-ForeColor="White" ControlStyle-Font-Size="15px" />
</Columns>
</asp:GridView>

Add Labels like this below it

<br />
<asp:Label runat="server" Text="Click On a Button to view details of a product" ID="lblname" ForeColor="#507CD1" Font-Size="20px"></asp:Label>
<br />
<asp:Label runat="server" Text="" ID="lbldesc" ForeColor="#507CD1" Font-Size="20px"></asp:Label>
<br />
<asp:Label runat="server" Text="" ID="lblstore" ForeColor="#507CD1" Font-Size="20px"></asp:Label>
<br />
<asp:Label runat="server" Text="" ID="lblprice" ForeColor="#507CD1" Font-Size="20px"></asp:Label>

Open your Web.config file and define your connectionString :

<connectionStrings>
<add name="myconnectionString" connectionString="Data Source=HITESH\SQLEXPRESS;Initial Catalog=MyDatabase;User ID=hitesh;Password=789"/>
</connectionStrings>

Open code file .cs file

and write the code to fill the GridView

public void fillDataGrid()
{
con = new SqlConnection(myconnectionString);
cmd = new SqlCommand("select * from mytable", con);
con.Open();
adapter = new SqlDataAdapter(cmd);
ds = new DataSet();
adapter.Fill(ds, "mytable");
datagridview.DataSource = ds.Tables[0];
datagridview.DataBind();
con.Close();
}

Call this method on PageLoad event

protected void Page_Load(object sender, EventArgs e)
{
fillDataGrid();
}

Add the code for GridView Paging :

protected void datagridview_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
datagridview.PageIndex = e.NewPageIndex;
fillDataGrid();
}

Now for the GridView Button Click event :

protected void datagridview_RowCommand(object sender, GridViewCommandEventArgs e)
{

//Here we will be passing the command name which we assigned to the button
if (e.CommandName == "ViewDetails")
{
int rowno = Int32.Parse(e.CommandArgument.ToString()); // It is the rowno of which the user as clicked

string ProductName = datagridview.Rows[rowno].Cells[2].Text.ToString(); // logical 0,1,2,3,4,5
lblname.Text = "Product name : " + ProductName;

string ProductDesc = datagridview.Rows[rowno].Cells[3].Text.ToString();
lbldesc.Text = "Product Desc : " + ProductDesc;

string ProductStore = datagridview.Rows[rowno].Cells[4].Text.ToString();
lblstore.Text = "At Store : " + ProductStore;

string ProductPrice = datagridview.Rows[rowno].Cells[5].Text.ToString();
lblprice.Text = "Product Price : " + ProductPrice;

}
}

Read the comments to understand the code, its pretty simple to understand.