CODEWITHSUNDEEP
javascriptjqueryjsonp
user3482841
user3482841

Reputation: 11

JavaScript - JSON does not display

This is my first time working with JSON and I need to display this JSON http://www.rockfm.mx/jsonApps/jsonAlAire.php on a webpage that is not on the same server as the JSON I know I have to use JSONP but my code is not working at all here it is an example

<script>
$(document).ready(function(){
});
$("#loaduserdata").click(function(){
    $("#userdata tbody").html("");
    $.getJSON(
        "www.rockfm.mx/jsonApps/jsonAlAire.php",
        function(data){
            $.each(data.userdata, function(i,user){
                var tblRow =
                    "<tr>"
                    +"<td>"+user.tituloDelShow+"</td>"
                    +"<td>"+user.locutores+"</td>"
                    +"</tr>"
                $(tblRow).appendTo("#userdata tbody");
            });
        }
    );
});
</script>

Upvotes: 0

Views: 73

Answers (2)

Marco
Marco

Reputation: 527

I think that the problem is the same origin security policy. My opinion is that the only solution is to use a php script on your own server that act as a gateway between your ajax and the remote server. How write the code depends on some factors related to your server configuration. A really simple solution (if your server support allow_url_fopen) can be something like:

getServerData.php

<?php
 echo   file_get_contents('http://www.rockfm.mx/jsonApps/jsonAlAire.php');
?>

Then, call getServeData.php with your script. With this little trick you will bypass same-origin restriction.

hope it help

Upvotes: 1

Companjo
Companjo

Reputation: 1792

You forgot http://

<script>
$(document).ready(function(){
});
$("#loaduserdata").click(function(){
    $("#userdata tbody").html("");
    $.getJSON(
        "http://www.rockfm.mx/jsonApps/jsonAlAire.php",
        function(data){
            $.each(data.userdata, function(i,user){
                var tblRow =
                    "<tr>"
                    +"<td>"+user.tituloDelShow+"</td>"
                    +"<td>"+user.locutores+"</td>"
                    +"</tr>"
                $(tblRow).appendTo("#userdata tbody");
            });
        }
    );
});
</script>

Upvotes: 0

Related Questions