Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 14 of 14
  1. #1
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts

    felgall's cross-domain AJAX call

    so, I'm looking at this:
    http://javascriptexample.net/ajax07.php

    The script attaches to the body like it should, but I can't figure out how to access the data. I understand that there should be some sort of jsonRequest function call, but I'm completely stumped as to what it would look like. here's my lame attempt thus far:

    Code:
    <body> 
    <select id="addoptions"></select>
    <script type="text/javascript">
    jsonpRequest = function(url, callback) {
      var jnum, jname, scr;
      if (!jsonRequest.cnt) jsonRequest.cnt = 0;
      jnum = 'j'+ jsonRequest.cnt++;
      jname = 'jsonRequest.'+jnum;
      if (-1 === url.indexOf('?')) url += '?jsonp='+jname;
      else url = '&jsonp='+jname;
      scr = document.createElement('script');
      jsonRequest[jnum] = function(resp) {
         try{
            callback(resp);
            }
         finally{
            delete jsonRequest[jnum];
            scr.parentNode.removeChild(scr);
            }
      };
      scr.src = url;
      document.getElementsByTagName('body')[0].appendChild(scr);
    }; 
     
    jsonpRequest("http://qa-find.uglii.com/Home/GetCountries/9a3d0a019-e523-487f-8250-fd98c31b6a84.json",function(result){
    for (var x = 0; x < result.length; x++) {
       document.getElementById("addoptions").options[x]=new Option(result[x].i,result[x].n);
          } 
    });
    </script>
    </body>
    Last edited by xelawho; 06-03-2012 at 06:52 AM.

  • #2
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    even if you corrected the obvious typo's
    in that code it still will not work for you
    unless you change the file found at
    http://qa-find.uglii.com/Home/GetCou...8c31b6a84.json
    or place some server side
    code at that url.

  • #3
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    The data is passed as an object directly into whatever function you specify as the callback function.

    So if you have

    jsonRequest('http://example.com', somefunc)

    and

    somefunc = function(x) {...}

    the returned data is the x object passed to that function
    Last edited by felgall; 06-03-2012 at 09:38 PM.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #4
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    I must be missing something really simple, then, because all I get is :
    Uncaught ReferenceError: jsonRequest is not defined

  • #5
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    Quote Originally Posted by xelawho View Post
    I must be missing something really simple, then, because all I get is :
    Uncaught ReferenceError: jsonRequest is not defined
    Yes, jsonRequest is undefined in that code.

  • #6
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    Quote Originally Posted by DaveyErwin View Post
    Yes, jsonRequest is undefined in that code.
    Clearly. So I thought that, like you said, it must just be typo's and that changing all the references from jsonRequest to jsonpRequest might do something, but no dice - no error, but the callback function doesn't even run.

    so...

  • #7
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    Quote Originally Posted by xelawho View Post
    Clearly. So I thought that, like you said, it must just be typo's and that changing all the references from jsonRequest to jsonpRequest might do something, but no dice - no error, but the callback function doesn't even run.

    so...
    here is another typo ...
    else url = '&jsonp='+jname;
    Quote Originally Posted by DaveyErwin View Post
    even if you corrected the obvious typo's
    in that code it still will not work for you
    unless you change the file found at
    http://qa-find.uglii.com/Home/GetCou...8c31b6a84.json
    or place some server side
    code at that url.

  • #8
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    I don't really know enough about what I'm doing to spot the errors - is that line supposed to be else url += '&jsonp='+jname;?

    but your quoted comment confuses me - isn't the point of jsonp meant to be that you can do this kind of thing without having to have access the target document?

    But maybe you're right, and that it is a problem with the file - the other jsonp examples out there seem to work fine on other files but not on this one. The closest I got was with the yahoo yql, which I was hoping to avoid as it seems to be just adding another step in the process, but at least it gets a result...

    Code:
    <body> 
    <select id="addoptions" onchange="alert(this.value)"></select>
    <script type="text/javascript">
    
    function makeList(o){
    result=o.query.results.json.json
    for (var x = 0; x < result.length; x++) {
       document.getElementById("addoptions").options[x]=new Option(result[x].n,result[x].i);
          } 
    document.getElementsByTagName('body')[0].removeChild(scr); 	  
    }
    
    var myurl=encodeURIComponent("http://qa-find.uglii.com/Home/GetCountries/9a3d0a019-e523-487f-8250-fd98c31b6a84.json")
    var filetype="json"
    var sel="*"
    
    var scr=document.createElement("script");
    scr.type="text/javascript"
    scr.src='http://query.yahooapis.com/v1/public/yql?q=select%20'+sel+'%20from%20'+filetype+'%20where%20url%3D%22'+myurl+'%2F%22&format=json&callback=makeList';
    document.getElementsByTagName('body')[0].appendChild(scr); 
    </script>
    </body>

  • #9
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    Quote Originally Posted by xelawho View Post
    I don't really know enough about what I'm doing to spot the errors - is that line supposed to be else url += '&jsonp='+jname;?

    but your quoted comment confuses me -
    I'm confused by which comments
    I have quoted ?

  • #10
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    these ones:

    Quote Originally Posted by DaveyErwin View Post
    even if you corrected the obvious typo's
    in that code it still will not work for you
    unless you change the file found at
    http://qa-find.uglii.com/Home/GetCou...8c31b6a84.json
    or place some server side
    code at that url.

  • #11
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    Quote Originally Posted by xelawho View Post
    these ones:
    Quote Originally Posted by DaveyErwin View Post
    even if you corrected the obvious typo's
    in that code it still will not work for you
    unless you change the file found at
    http://qa-find.uglii.com/Home/GetCou...8c31b6a84.json
    or place some server side
    code at that url.
    yes same problem here ...

    http://www.codingforums.com/showthread.php?t=262806

  • #12
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    but wait...

    if it works when hosted on my server:
    jQuery
    Code:
    <script type="text/javascript">
    $(document).ready(function(){
          $.getJSON("9a3d0a019-e523-487f-8250-fd98c31b6a84.json",function(result){
          $.each(result, function(i){
    	   $("#addoptions").append('<option name='+result[i].i+'style="padding: 10px 0pt 0pt; float: left;">'+result[i].n+'</option>');
          });
        });
    });
    </script>
    vanilla:
    Code:
    function downloadUrl(callback) {
    url="9a3d0a019-e523-487f-8250-fd98c31b6a84.json"
    var jsonFile = window.XMLHttpRequest?new XMLHttpRequest:new ActiveXObject('Microsoft.XMLHTTP');
    	jsonFile.onreadystatechange = function() {
       if (jsonFile.readyState == 4) {
         callback(jsonFile, jsonFile.status);
       }
     };
    jsonFile.open("GET", url, true); 
    jsonFile.send(null);
    }
    
    
    downloadUrl(function(data) {
    result=JSON.parse(data.responseText);
      for (var x = 0; x < result.length; x++) {
       document.getElementById("addoptions").options[x]=new Option(result[x].n,result[x].i);
          } 
      });
    shouldn't jsonp be able to do the same thing cross-domain?

  • #13
    Regular Coder
    Join Date
    Aug 2010
    Posts
    974
    Thanks
    19
    Thanked 212 Times in 210 Posts
    the code in post #1 is completely
    different from the code in post #12

  • #14
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    yeah - you should have seen all the variations in between

    but this is kind of my point: works same-domain (post #12) doesn't work cross-domain (post#1)

    I've pretty much given up, anyway... the code in 1 works on other json files (once the typo's are corrected), so I guess it's just something about that one


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •