Hi akhter,
Please refer below sample.
You are not inheriting the jQuery library.
Add the below library.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
HTML
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-json/2.6.0/jquery.json.min.js"
type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#btnShowData").on("click", function () {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/BindAttandenace",
data: "{}",
dataType: "json",
success: function (result) {
debugger;
for (var i = 0; i < result.d.length; i++) {
$("#GVTime").append("<tr><td>" +
result.d[i].CustomerId + "</td><td>" +
result.d[i].Name + "</td><td>" +
result.d[i].Country + "</td></tr>")
}
},
error: function (result) {
alert("Error");
}
});
return false;
});
});
</script>
<button id="btnShowData" runat="server">
Get Data</button>
<div>
<asp:GridView ID="GVTime" runat="server" AutoGenerateColumns="False" ShowFooter="True"
Width="657px" Font-Size="medium" GridLines="Vertical" Height="256px">
<Columns>
<asp:TemplateField HeaderText="CustomerId">
<ItemTemplate>
<asp:Label ID="lblCustomerId" runat="server" Text='<%# Bind("CustomerId") %>'> </asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:Label ID="lblName" runat="server" Text='<%# Bind("Name") %>'> </asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Country">
<ItemTemplate>
<asp:Label ID="lblCountry" runat="server" Text='<%# Bind("Country") %>'> </asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="Tan" />
<HeaderStyle BackColor="Tan" Font-Bold="True" />
<PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" HorizontalAlign="Center" />
<RowStyle BorderColor="Black" />
<SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
<SortedAscendingCellStyle BackColor="#FAFAE7" />
<SortedAscendingHeaderStyle BackColor="#DAC09E" />
<SortedDescendingCellStyle BackColor="#E1DB9C" />
<SortedDescendingHeaderStyle BackColor="#C2A47B" />
</asp:GridView>
</div>
Namespaces
using System.Data;
using System.Web.Services;
using System.Configuration;
using System.Data.SqlClient;
Code
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
this.BindAttandenacerow();
}
}
public void BindAttandenacerow()
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[3]{
new DataColumn("CustomerId"),
new DataColumn("Name"),
new DataColumn("Country")
});
dt.Rows.Add("1", "John Mathew", "UK");
GVTime.DataSource = dt;
GVTime.DataBind();
}
[WebMethod]
public static Attendance[] BindAttandenace()
{
string conString = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand cmd = new SqlCommand("SELECT * FROM Customers", con))
{
using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
{
DataTable dt = new DataTable();
sda.Fill(dt);
List<Attendance> custList = new List<Attendance>();
foreach (DataRow dtrow in dt.Rows)
{
Attendance cust = new Attendance();
cust.CustomerId = dtrow["CustomerId"].ToString();
cust.Name = dtrow["Name"].ToString();
cust.Country = dtrow["Country"].ToString();
custList.Add(cust);
}
return custList.ToArray();
}
}
}
}
public class Attendance
{
public string CustomerId { get; set; }
public string Name { get; set; }
public string Country { get; set; }
}