With reference of these article.
Here on Customers.aspx page i have used this functionality to get the page web method method to be called when the link is clicked.
url: '<%= Page.ResolveUrl("~/Customers.aspx/GetCurrentTime")%>',
I have change the GridView column and added some Script in Customers.aspx;
HTML
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="Id" HeaderText="Id" ItemStyle-Width="30" />
<asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width="150" />
<asp:BoundField DataField="Country" HeaderText="Country" ItemStyle-Width="150" />
<%--<asp:HyperLinkField Text="View" DataNavigateUrlFormatString="~/Customers/{0}" DataNavigateUrlFields="Id" />--%>
<asp:TemplateField>
<ItemTemplate>
<asp:HyperLink ID="lnkView" runat="server" Text="View" NavigateUrl="#" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
JavaScript
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('[id*=lnkView]').click(function () {
debugger;
var name = $(this).parents().closest('tr').find('td:nth-child(2)').html();
$.ajax({
type: "POST",
url: '<%= Page.ResolveUrl("~/Customers.aspx/GetCurrentTime")%>',
data: '{name: "' + name + '" }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert(response.d);
}
});
});
function OnSuccess(response) {
alert(response.d);
}
});
</script>
C#
[System.Web.Services.WebMethod]
public static string GetCurrentTime(string name)
{
return "Hello " + name + Environment.NewLine + "The Current Time is: "
+ DateTime.Now.ToString();
}