aspdotnet-suresh offers articles and tutorials,csharp dot net, articles and tutorials,VB.NET Articles,Gridview articles,code examples of 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

Call ASP.Net Page Method using jQuery AJAX Example

Aug 2, 2016

Here I will explain how to call page method using jQuery ajax example or jQuery ajax call page method with example or page method using jQuery ajax with example or jQuery 
ajax bind dropdownlist using page method with example.
In previous articles I explained jQuery load more data when click on button in, jQuery autocomplete textbox with master page in, jQuery ajax json example in
Bind gridview using JQuery in asp.netAutoComplete textbox with JQuery using and many articles related to and ajaxNow I will explain how to call page using jQuery ajax with example.
We will learn how to call page method using jQuery ajax with dropdownlist binding from database for that first design table in database and give name as Country as shown below
Column Name
Data Type
Allow Nulls
int(set identity property=true)
After completion table design enter some of Country details in database to work for our sample and write the following code in your aspx page

<html xmlns="">
<head runat="server">
<title>Bind Dropdownlist with JQuery in</title>
<script type="text/javascript" src=""></script>
<script type="text/javascript">
$(document).ready(function() {
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/BindDatatoDropdown",
data: "{}",
dataType: "json",
success: function(data) {
$.each(data.d, function(key, value) {
error: function(result) {
<form id="form1" runat="server">
<asp:DropDownList ID="ddlCountry" runat="server" />
If you observe above code in header section I added script file link by using that file we have a chance to interact with JQuery. If you want to know about script function mentioned in header section check these posts JQuery AutoComplete textbox with database in and call page methods in JQuery.

Now open code behind file and add following namespaces

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Web.Services;
After that write the following code

C#.NET Code

protected void Page_Load(object sender, EventArgs e)

public static CountryDetails[] BindDatatoDropdown()
DataTable dt = new DataTable();
List<CountryDetails> details = new List<CountryDetails>();

using (SqlConnection con = new SqlConnection("Data Source=SureshDasari;Initial Catalog=MySampleDB;Integrated Security=true"))
using (SqlCommand cmd = new SqlCommand("SELECT CountryID,CountryName FROM Country", con))
SqlDataAdapter da = new SqlDataAdapter(cmd);
foreach (DataRow dtrow in dt.Rows)
CountryDetails country = new CountryDetails();
country.CountryId = Convert.ToInt32(dtrow["CountryId"].ToString());
country.CountryName = dtrow["CountryName"].ToString();
return details.ToArray();
public class CountryDetails
public int CountryId { get; set; }
public string CountryName { get; set; }
VB.NET Code:

Imports System.Collections.Generic
Imports System.Data
Imports System.Data.SqlClient
Imports System.Web.Services

Partial Class _Default
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)

End Sub
<WebMethod()> _
Public Shared Function BindDatatoDropdown() As CountryDetails()
Dim dt As New DataTable()
Dim details As New List(Of CountryDetails)()

Using con As New SqlConnection("Data Source=SureshDasari;Initial Catalog=MySampleDB;Integrated Security=true")
Using cmd As New SqlCommand("SELECT CountryID,CountryName FROM Country", con)
Dim da As New SqlDataAdapter(cmd)
For Each dtrow As DataRow In dt.Rows
Dim country As New CountryDetails()
country.CountryId = Convert.ToInt32(dtrow("CountryId").ToString())
country.CountryName = dtrow("CountryName").ToString()
End Using
End Using
Return details.ToArray()
End Function
Public Class CountryDetails
Public Property CountryId() As Integer
Return m_CountryId
End Get
Set(ByVal value As Integer)
m_CountryId = Value
End Set
End Property
Private m_CountryId As Integer
Public Property CountryName() As String
Return m_CountryName
End Get
Set(ByVal value As String)
m_CountryName = Value
End Set
End Property
Private m_CountryName As String
End Class
End Class
If you observe above example we are calling [Web Method] in page using jQuery ajax method. Now run your application and check the output that would be like this

Download sample code attached

If you enjoyed this post, please support the blog below. It's FREE!

Get the latest,, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email


Give your Valuable Comments

Other Related Posts

© 2015 All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.