Make cross-domain ajax JSONP request with jQuery

Question

I would like to parse JSON array data with jquery ajax with the following code    lt  DOCTYPE html PUBLIC  -  W3C  DTD XHTML 1 0 Transitional  EN   http   www w3 org TR xhtml1 DTD xhtml1-transitional dtd  gt   lt html xmlns  http   www w3 org 1999 xhtml  gt   lt head gt   lt title gt Sample lt  title gt   lt script type  text javascript  src  Scripts jquery-1 7 2 min js  gt  lt  script gt   lt script type  text javascript  gt      var result      function jsonparser1               ajax               type   GET               url   http   10 211 2 219 8080 SampleWebService sample do               dataType   jsonp               success  function  xml                    alert xml data 0  city                   result   xml code                  document myform result1 value   result                                            lt  script gt       lt  head gt   lt body gt   lt p id  details  gt  lt  p gt   lt form name  myform  gt       lt input type  button  name  clickme  value  Click here to show the first name  onclick jsonparser1     gt       lt input type  text  name  result1  readonly  true   gt           lt  form gt   lt  body gt   lt  html gt    My JSON data is     Data        Address   chetpet   FirstName   arulmani   Id  1  LastName   sathish   City   chennai     Address   ramapuram   FirstName   raj   Id  2  LastName   nagu   City   chennai     Address   ramapuram   FirstName   raj   Id  2  LastName   nagu   City   chennai     Address   ramapuram   FirstName   ramaraj   Id  3  LastName   rajesh   City   chennai     Address   ramapuram   FirstName   yendran   Id  3  LastName   sathi   City   chennai     Code  true    But i am not getting any output   anybody please help out

User · Answer

You need to use the ajax-cross-origin plugin: http://www.ajax-cross-origin.com/

Just add the option crossOrigin: true

$.ajax({
    crossOrigin: true,
    url: url,
    success: function(data) {
        console.log(data);
    }
});

User · Answer

Your JSON-data contains the property Data  but you re accessing data  It s case sensitive  function jsonparser1           ajax           type   GET           url   http   10 211 2 219 8080 SampleWebService sample do           dataType   json           success  function  xml                alert xml Data 0  City               result   xml Code              document myform result1 value   result                                 EDIT Also City and Code is in the wrong case   Thanks  Christopher Kenney   EDIT2 It should also be json  and not jsonp  at least in this case   UPDATE According to your latest comment  you should read this answer  https   stackoverflow com a 11736771 325836 by Abdul Munim

User · Answer

use open public proxy YQL  hosted by Yahoo   Handles XML and HTML  https   gist github com rickdog d66a03d1e1e5959aa9b68869807791d5

User · Answer

Concept explained  Are you trying do a cross-domain AJAX call  Meaning  your service is not hosted in your same web application path  Your web-service must support method injection in order to do JSONP   Your code seems fine and it should work if your web services and your web application hosted in the same domain   When you do a   ajax with dataType   jsonp  meaning that jQuery is actually adding a new parameter to the query URL   For instance  if your URL is http   10 211 2 219 8080 SampleWebService sample do then jQuery will add  callback  some random dynamically generated method    This method is more kind of a proxy actually attached in window object  This is nothing specific but does look something like this   window some random dynamically generated method   function actualJsonpData          here actually has reference to the success function mentioned with   ajax       so it just calls the success method like this       successCallback actualJsonData       Summary  Your client code seems just fine  However  you have to modify your server-code to wrap your JSON data with a function name that passed with query string  i e   If you have reqested with query string   callback my callback method   then  your server must response data wrapped like this   my callback method  your json serialized data

User · Answer

Try   alert xml Data 0  City    Case sensitivly

User · Answer

you need to parse  your xml with jquery json parse   i e    var parsed json     parseJSON xml

User · Answer

alert xml data 0  city    use xml data  Data   0  city instead

[javascript] Make cross-domain ajax JSONP request with jQuery

Examples related to javascript

Examples related to jquery

Examples related to ajax

Examples related to json