Consuming JSON and XML Webservices from an HTML Page using jQuery
page 1 of 4
Published: 12 Apr 2011
Unedited - Community Contributed
My previous article, explains about consuming web services from HTML pages, but it is restricted to IE only. I would like to explain a method which overcomes that and works in all major browsers. This time I want to show how to consume both JSON and XML data.
by Rajesh Toleti
Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 27623/ 53


    Please read to find the need of consuming webservices from a HTML page. The methodology explained in the above article works only in IE. By February 2011 IE accounts for around 44% while Firefox enjoys a share of 29%.Chrome is in the third place with around 14%.So there is a clear need for a cross browser solution. Here comes the JQUERY…(If you are new to JQUERY, please see the reference section for its official website and tutorials)

 We use JQUERY cross browser capabilities to achieve our objective. In the first part we will explore the consumption of XML webservices and then we will look into JSON webservices in the second part.


 Download JQUERY from this link

Note: I have not tested the code with new versions of JQUERY yet. You can download new versions and experiment. I have used minified version of JQERY for faster execution, but it is not very user-friendly to read. If you want to read the code inside JQUERY, please download uncompressed version. In your code you can refer to uncompressed version as well, but obviously it takes bit more time to execute.

All the versions are available at



  This article deals with the scenario where both client (HTML page) and webservices reside on the same server. This may work with the webservices on different servers, if they allow cross-domain requests.


View Entire Article

User Comments

Title: Data cant shown in Google Chrome   
Name: Khoo
Date: 2012-08-02 6:32:43 AM
Great explanation! It helps me a lot! Thanks!
It works fine in IE.
However, the table with no data shown in Google Chrome.
Any idea?
Title: paging   
Name: vinay
Date: 2011-04-19 7:29:48 AM
good post but i have one more thing that is how can i do paging for the table created using json data

Community Advice: ASP | SQL | XML | Regular Expressions | Windows

©Copyright 1998-2024  |  Page Processed at 2024-06-14 1:55:20 PM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search