Home Articles CodeDigest Tutorials FAQs
Skip Navigation LinksHome » Article » jQuery Article » Calling a WebService using jQuery in ASP.Net   You are not logged in.



CodeDigest Navigation

Technology News
No News Feeds available at this time.

Community News
No News Feeds available at this time.
Calling a WebService using jQuery in ASP.Net

By Bala Murugan
Posted On Jan 13,2010
Article Rating: (Login)
Be first to rate
this article.
No of Comments: 6
Print this article.
Category: jQuery

Subscribe to our feed!

Download Aspose, it really helps

Calling a WebService using jQuery in ASP.Net


jQuery library has become one of the most widely used javascript library that heavily simplified the client side scripting. Apart from DOM parsing and other advantages, jQuery library excelled so much in AJAX communications. jQuery offers lots of advantages over the ASP.Net Ajax framework by making communication very lighter and simpler. To do this, jQuery library is packed with some handful of useful Ajax methods. Refer here[] to know more.

Moving forward, we will see how to use jQuery Ajax methods to call a WebService method in ASP.Net.


Integrating jQuery in ASP.Net

CodeDigest.Com has some useful FAQ’s to integrate jQuery in projects.

Download the latest jQuery library from and integrate into your project. Read the following FAQ's to integrate jQuery library to your project.

What is jQuery? How to use it in ASP.Net Pages?

How to enable jQuery intellisense in Visual Studio 2008?

How to use jQuery intellisense in an external javascript file?


Creating Webservice

Now, to make our understanding simple we will include a simple webservice method that returns date and time of the server. We will then try consuming this webservice method using jQuery library. Include a webservice in your project by right clicking the project in Solution Explorer and click “Add New Item..” dialog box. Select Webservice from the dialog and name it as GetDate.asmx.


Include a method called GetDateTime() that returns a date time string .

In order to call the webservice method from javascript, you have to uncomment the attribute System.Web.Script.Services.ScriptService of webservice class. Refer the below code[bolded]


[WebService(Namespace = "")]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.


public class GetDate : System.Web.Services.WebService {


public GetDate () {


//Uncomment the following line if using designed components





public string HelloWorld() {

return "Hello World";




public string GetDateTime()


return DateTime.Now.ToString();




Now, before consuming webservice method using jQuery it is necessary to know some restrictions on calling webservice methods from javascript.

1. Only POST method can be used to call a webservice method.

2. The HTTP Content-Type header should be set to the value “application/json”.


There is a built in validation layer in ASP.Net that checks for the above 2 things. The request will be rejected if both the constraints are not met. This is done for preventing some security vulnerabilities like cross site request forgery attacks. Read the links in Reference section to know more.


Consuming Webservice using jQuery

The below jQuery code can be used to call the webservice method.


<script src="_script/jquery-1[1].3.2.js" type="text/javascript"></script>

<script language="javascript">

$(document).ready(function() {

$("#btGetDate").click(function() {


type: "POST",

url: "/AjaxSample/GetDate.asmx/GetDateTime",

data: "{}",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(msg) {









<form id="form1" runat="server">


<div id="dvDate"></div><input id="btGetDate" type="button" value="Get Date" />





Recent Articles

In the above code, I have included the project folder name “/AjaxSample/” in the url property of the $.ajax() method. Specify the folder name of your project here and update it accordingly when moving to production.



Webservice Security


With the introduction of jQuery library, the client side scripting was made simpler and it was actually taken to next level where developers now can do some complex operations and Ajax communication very easily. This article proved one of the advantages of jQuery where we can consume an webservice with very less effort.

Similar Articles
  • You can contribute to CodeDigest.Com:
    Article Feedback
    Submitted By  
    Enter the verification number
    Hi,this is a nice li
    Hi,this is a nice little sicrpt, thank you very much for posting it:)However this works only for instances-children of p' elements.Being new to jquery I tried to change the containing element from p to body or even div as follows:var tablet = $( div').text().replace(/Tablet PC /g, Tablet PC );$( div').html(tablet);}but it messes up the whole layout, just displaying ALL text at once ignoring css and layout/formatting.What am I doing wrong?Thanks,kate [url=]mjrxkffgnlv[/url] [link=]drpkbl[/link]
    When you suppress <a
    When you suppress <a href="">pelpoe</a> for a long period of time, the simmering emotion would one day explode like a volcano, and would turn into a revolution. People display revolt by doing exactly what is being suppressed. The same with political suppression, and same with Human Rights Violation. It is a matter of time.
    Stress is one of the
    Stress is one of the weapons used by auahtritarion regimes to wear down resistance. Prisoners are routinely subjected to stress in varying degrees depending on the value of the confessions to be extracted, and whole populations can be put under pressure to toe the official line, for example under the Japanese occupation, through withholding of food ration coupons or fear of torture and beheading. In developed economies, having a mortgage is one of the primary determinants of our daily behavior. People with a lifetime debt avoid rocking the boat by keeping a low profile, or working to maintain the status quo. In such situations, some people can become unhinged and do silly things.According to my over-simplified interpretation of Freudian theory, our sexual desires are repressed to conform to societal norms, but occasionally rear its ugly head when an individual loses control, e.g. when under emotional strain, and manifest itself through deviant sexual behavior. Whether casualties of living in a our pressure-cooker environment or sufferers of some psychological malady, these people need our sympathies not condemnation, for they really know not what they do.
    Best article
    Its really a best article which help begging to know how to call web service methods through Jquery
    Nice article
    nice article, it is really helpfull for me
    Passing Parameters to WebService from JQuery
    If youwanted to send parameters to Web Service from the invoking JQuery? All you need to do is to add below statement instead of data: "{}"

    data: "{'Id1':'2','Id2':'4'}"