jquery gridview custom control

Tags | gridview custom control c#, jquery datatable complete example, jquery datatable example in asp.net c#, custom gridview control in asp.net c#, custom gridview control in vb.net, jquery gridview custom control

jQuery Datatable Complete Example

This HTML jQuery Gridview Custom Control is specially created for easy to use and reduce the code complexity and length. You just need to assign datatable to this control and it will automatically generate HTML gridview as per datatable given.

jQuery Gridview Custom Control Features

  • Easy to use less coding required.
  • Paging, Sorting, and Search Functionality
  • Design customize possible using CSS.
  • No postback server round trip.
  • Quick search without postback using ajax.

How to use custom gridview control in asp.net c#

This custom control package includes three files:-

  • GridView.dll
  • CSS
  • images

Now create a new empty asp.net web application and include all files. After this add GridView Custom Controls dll to Visual Studio ToolBox:-

  • Right-click on toolbox Adding GridView Custom Controls dll to Visual Studio ToolBox jquery gridview custom control jQuery Gridview Custom Control ASP.NET Adding GridView Custom Controls dll to Visual Studio ToolBox
  • Select “Choose Items”
  • Browse to GridView DLL
  • Add the items



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="GridView" Namespace="GridView" TagPrefix="cc1" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>custom gridview control in asp.net c#</title>
    <form id="form1" runat="server">
        <h1>jQuery Datatable Complete Example</h1>
            <cc1:HTMLGridView ID="HTMLGridView1" runat="server" />

using System;
using System.Data;
public partial class _Default : System.Web.UI.Page
    protected void Page_Load(object sender, EventArgs e)

    private void BindCustomGridViewControl()
        DataTable dt = new DataTable();
        dt.Columns.Add("EmpId", typeof(int));
        dt.Columns.Add("Name", typeof(string));
        dt.Columns.Add("Address", typeof(string));
        dt.Columns.Add("Date", typeof(DateTime));
        dt.Rows.Add(25, "Rk", "Gurgaon", DateTime.Now);
        dt.Rows.Add(50, "Sachin", "Noida", DateTime.Now);
        dt.Rows.Add(10, "Nitin", "Noida", DateTime.Now);
        dt.Rows.Add(21, "Aditya", "Meerut", DateTime.Now);
        dt.Rows.Add(100, "Mohan", "Banglore", DateTime.Now);

        dt.Rows.Add(101, "ABC", "Delhi", DateTime.Now);
        dt.Rows.Add(102, "XYZ", "Noida", DateTime.Now);
        dt.Rows.Add(103, "BBC", "Delhi", DateTime.Now);
        dt.Rows.Add(104, "CIA", "Banglore", DateTime.Now);
        dt.Rows.Add(105, "KBC", "Delhi", DateTime.Now);
        dt.Rows.Add(106, "Jack", "Noida", DateTime.Now);
        dt.Rows.Add(107, "Jhon", "Gurgaon", DateTime.Now);
        dt.Rows.Add(108, "Mali", "Gurgaon", DateTime.Now);
        dt.Rows.Add(109, "Sara", "Noida", DateTime.Now);

        HTMLGridView1.DataSource = dt;

Download Source Code

Did you find this post useful? I hope you liked this article. Please share with me your valuable suggestions and feedback.


Please enter your comment!
Please enter your name here