You have seen many times that the GridView is bind with DataTable and wonder if you can bind it by another way. The answer is "Yes", you can bind a GridView with a Class too.
Bind GridView with Class
Let me show you how to bind your GridView using a Class.
1. First add the GridView to the Web Form.
<asp:GridView ID="gridView" runat="server"></asp:GridView>
2. Go to the CS page and create a Product Class.
class Product
{
public string name { get; set; }
public string image { get; set; }
public string categoryName { get; set; }
public decimal price { get; set; }
}
3. Create a function that fills the Class with dummy data.
void LoadData()
{
product = new List<Product>();
product.Add(new Product() { name = "Vanheusen Women's Skirt", image = "Image/s1.jpg", categoryName = "Skirts", price = 20.89M });
product.Add(new Product() { name = "Decot Paradise Animal Print Women's Regular Black Skirt", image = "Image/s2.jpg", categoryName = "Skirts", price = 35.59M });
product.Add(new Product() { name = "DeeVineeTi Polka Print Women's Wrap Around White, Blue Skirt", image = "Image/s3.jpg", categoryName = "Skirts", price = 98.00M });
product.Add(new Product() { name = "Raabta Fashion Striped Women's Pencil Black, White Skirt", image = "Image/s4.jpg", categoryName = "Skirts", price = 120.00M });
product.Add(new Product() { name = "Ishin Solid Women's Regular Orange Skirt", image = "Image/s5.jpg", categoryName = "Skirts", price = 115.85M });
product.Add(new Product() { name = "Adidas Women's Skirt", image = "Image/s6.jpg", categoryName = "Skirts", price = 105.74M });
product.Add(new Product() { name = "V Dot by Van Huesen Skinny Fit Men's Grey Trousers", image = "Image/p1.jpg", categoryName = "Pants", price = 10.89M });
product.Add(new Product() { name = "French Connection Slim Fit Men's Beige Trousers", image = "Image/p2.jpg", categoryName = "Pants", price = 25.59M });
product.Add(new Product() { name = "Indian Terrain Slim Fit Men's White Trousers", image = "Image/p3.jpg", categoryName = "Pants", price = 48.00M });
product.Add(new Product() { name = "United Colors of Benetton Slim Fit Men's Beige Trousers", image = "Image/p4.jpg", categoryName = "Pants", price = 120.00M });
product.Add(new Product() { name = "Numero Uno Slim Fit Men's Black Trousers", image = "Image/p5.jpg", categoryName = "Pants", price = 155.85M });
product.Add(new Product() { name = "John Players Slim Fit Men's Grey Trousers", image = "Image/p6.jpg", categoryName = "Pants", price = 165.74M });
product.Add(new Product() { name = "Vu 140cm (55) Full HD Smart LED TV", image = "Image/e1.png", categoryName = "Electronics", price = 80.89M });
product.Add(new Product() { name = "BPL Vivid 80cm (32) HD Ready LED TV", image = "Image/e2.png", categoryName = "Electronics", price = 235.59M });
product.Add(new Product() { name = "Moto E3 Power (Black, 16 GB)", image = "Image/e3.jpg", categoryName = "Electronics", price = 198.00M });
product.Add(new Product() { name = "Krishna M (Silver, 64 GB)", image = "Image/e4.jpg", categoryName = "Electronics", price = 120.00M });
product.Add(new Product() { name = "Sansui 150 L Direct Cool Single Door Refrigerator", image = "Image/e5.jpg", categoryName = "Electronics", price = 115.85M });
product.Add(new Product() { name = "Whirlpool 245 L Frost Free Double Door Refrigerator", image = "Image/e6.jpg", categoryName = "Electronics", price = 105.74M });
}
4. Fill the class with data.
LoadData();
5. Now finally bind the GridView with the class data like this:
gridView.DataSource = product;
gridView.DataBind();
Binding GridView with Class on Page Load Event
Here I will show you how to bind the GridView on Page Load event.
Add the below code to the .cs page.
List<Product> product;
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
LoadData();
gridView.DataSource = product;
gridView.DataBind();
}
}
void LoadData()
{
//code
}
class Product
{
public string name { get; set; }
public string image { get; set; }
public string categoryName { get; set; }
public decimal price { get; set; }
}
and that's it the Binding of GridView is done.
Related Article: Also check the related article which teaches the 'Binding of GridView with Paging using jQuery Load with No Page Refresh'. Check this article here - asp.net gridview example.
Bind GridView with Class
Let me show you how to bind your GridView using a Class.
1. First add the GridView to the Web Form.
<asp:GridView ID="gridView" runat="server"></asp:GridView>
2. Go to the CS page and create a Product Class.
class Product
{
public string name { get; set; }
public string image { get; set; }
public string categoryName { get; set; }
public decimal price { get; set; }
}
3. Create a function that fills the Class with dummy data.
void LoadData()
{
product = new List<Product>();
product.Add(new Product() { name = "Vanheusen Women's Skirt", image = "Image/s1.jpg", categoryName = "Skirts", price = 20.89M });
product.Add(new Product() { name = "Decot Paradise Animal Print Women's Regular Black Skirt", image = "Image/s2.jpg", categoryName = "Skirts", price = 35.59M });
product.Add(new Product() { name = "DeeVineeTi Polka Print Women's Wrap Around White, Blue Skirt", image = "Image/s3.jpg", categoryName = "Skirts", price = 98.00M });
product.Add(new Product() { name = "Raabta Fashion Striped Women's Pencil Black, White Skirt", image = "Image/s4.jpg", categoryName = "Skirts", price = 120.00M });
product.Add(new Product() { name = "Ishin Solid Women's Regular Orange Skirt", image = "Image/s5.jpg", categoryName = "Skirts", price = 115.85M });
product.Add(new Product() { name = "Adidas Women's Skirt", image = "Image/s6.jpg", categoryName = "Skirts", price = 105.74M });
product.Add(new Product() { name = "V Dot by Van Huesen Skinny Fit Men's Grey Trousers", image = "Image/p1.jpg", categoryName = "Pants", price = 10.89M });
product.Add(new Product() { name = "French Connection Slim Fit Men's Beige Trousers", image = "Image/p2.jpg", categoryName = "Pants", price = 25.59M });
product.Add(new Product() { name = "Indian Terrain Slim Fit Men's White Trousers", image = "Image/p3.jpg", categoryName = "Pants", price = 48.00M });
product.Add(new Product() { name = "United Colors of Benetton Slim Fit Men's Beige Trousers", image = "Image/p4.jpg", categoryName = "Pants", price = 120.00M });
product.Add(new Product() { name = "Numero Uno Slim Fit Men's Black Trousers", image = "Image/p5.jpg", categoryName = "Pants", price = 155.85M });
product.Add(new Product() { name = "John Players Slim Fit Men's Grey Trousers", image = "Image/p6.jpg", categoryName = "Pants", price = 165.74M });
product.Add(new Product() { name = "Vu 140cm (55) Full HD Smart LED TV", image = "Image/e1.png", categoryName = "Electronics", price = 80.89M });
product.Add(new Product() { name = "BPL Vivid 80cm (32) HD Ready LED TV", image = "Image/e2.png", categoryName = "Electronics", price = 235.59M });
product.Add(new Product() { name = "Moto E3 Power (Black, 16 GB)", image = "Image/e3.jpg", categoryName = "Electronics", price = 198.00M });
product.Add(new Product() { name = "Krishna M (Silver, 64 GB)", image = "Image/e4.jpg", categoryName = "Electronics", price = 120.00M });
product.Add(new Product() { name = "Sansui 150 L Direct Cool Single Door Refrigerator", image = "Image/e5.jpg", categoryName = "Electronics", price = 115.85M });
product.Add(new Product() { name = "Whirlpool 245 L Frost Free Double Door Refrigerator", image = "Image/e6.jpg", categoryName = "Electronics", price = 105.74M });
}
4. Fill the class with data.
LoadData();
gridView.DataSource = product;
gridView.DataBind();
Binding GridView with Class on Page Load Event
Here I will show you how to bind the GridView on Page Load event.
Add the below code to the .cs page.
List<Product> product;
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
LoadData();
gridView.DataSource = product;
gridView.DataBind();
}
}
void LoadData()
{
//code
}
class Product
{
public string name { get; set; }
public string image { get; set; }
public string categoryName { get; set; }
public decimal price { get; set; }
}
and that's it the Binding of GridView is done.
Related Article: Also check the related article which teaches the 'Binding of GridView with Paging using jQuery Load with No Page Refresh'. Check this article here - asp.net gridview example.