Please refer below code
HTML
<div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$.get("HandlerCS.ashx", '{}', function (data) {
OnSuccess(data);
});
});
function OnSuccess(response) {
var customers = response;
var row = $("[id*=gvCustomers] tr:last-child").clone(true);
$("[id*=gvCustomers] tr").not($("[id*=gvCustomers] tr:first-child")).remove();
$.each(customers, function () {
var customer = $(this)[0];
$("td", row).eq(0).html(customer.CustomerId);
$("td", row).eq(1).html(customer.ContactName);
$("td", row).eq(2).html(customer.Country);
$("[id*=gvCustomers]").append(row);
row = $("[id*=gvCustomers] tr:last-child").clone(true);
});
}
</script>
<asp:GridView ID="gvCustomers" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:BoundField ItemStyle-Width="150px" DataField="CustomerID" HeaderText="CustomerID" />
<asp:BoundField ItemStyle-Width="150px" DataField="ContactName" HeaderText="CustomerID" />
<asp:BoundField ItemStyle-Width="150px" DataField="Country" HeaderText="Country" />
</Columns>
</asp:GridView>
</div>
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
this.BindDummyRow();
}
}
private void BindDummyRow()
{
DataTable dummy = new DataTable();
dummy.Columns.Add("CustomerID");
dummy.Columns.Add("ContactName");
dummy.Columns.Add("Country");
dummy.Rows.Add();
gvCustomers.DataSource = dummy;
gvCustomers.DataBind();
}
HandlerCS.ashx
<%@ WebHandler Language="C#" Class="HandlerCS" %>
using System;
using System.Web;
using System.Data;
using System.Configuration;
using System.Data.SqlClient;
using System.Collections.Generic;
using System.Web.Script.Serialization;
public class HandlerCS : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
string json = this.GetCustomersJSON();
context.Response.ContentType = "text/json";
context.Response.Write(json);
}
private string GetCustomersJSON()
{
List<object> customers = new List<object>();
using (SqlConnection conn = new SqlConnection())
{
conn.ConnectionString = ConfigurationManager.ConnectionStrings["conString"].ConnectionString;
using (SqlCommand cmd = new SqlCommand())
{
cmd.CommandText = "SELECT top 10 CustomerID, ContactName, Country FROM Customers";
cmd.Connection = conn;
conn.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
customers.Add(new
{
CustomerId = sdr["CustomerId"],
ContactName = sdr["ContactName"],
Country = sdr["Country"]
});
}
}
conn.Close();
}
return (new JavaScriptSerializer().Serialize(customers));
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
I hope this will help you out.