How to display cross domain json data using Jquery

How to display cross domain json data using Jquery

In this Post We Will Explain About is How to display cross domain json data using Jquery With Example and Demo.Welcome on Pakainfo.com – Examples, The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to Accessing other domain web services via jQuery Ajax Example

In this post we will show you Best way to implement jQuery’s JSONP Explained with Examples, hear for Display different domain data using Jquery and JSON with Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

Also Read :  PHP Multiple images upload using jQuery Ajax

PHP – json from another domain using jquery

Some more days back I had new posted a Live24comu. about parsing data like as a JSON data with jQuery using .getJSON() functions. In this post I want to learn about ‘How to use JSON callback as well as to display cross domain data using jQuery’. this is a simple and useful.

Just copy and paste means put this following source code between tag. we can display another domain data.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript" src="http://pakainfo.com/domain.json.js"></script>
<link href="http://pakainfo.com/domain_css.css" rel="stylesheet" type="text/css">
<ol id="liveJSONData" class="live-jsonbox"></ol>

domain.json.js

Javascript some following source code read the here JSON file.

$(document).ready(function()
{
$.getJSON("http://pakainfo.com/json.php?total_count=5&jsoncall=?",function(data)
{
$.each(data.posts, function(i,data)
{
var jsondata ="<li>"+data.comments+"</li>";
$(jsondata).appendTo("ol#liveJSONData");
});
}
);
return false;
});

Also Read :  Jquery Customised datatable Grids inline add edit delete

json.php

Contains simple PHP code displaying some results from clients table in JSON format.

<?php
include('config.php');
if($_GET['total_count'])
{
$total_count=$_GET['total_count'];
$total_count=mysql_real_escape_string($total_count);
$sql=mysql_query("select comments from clients order by client_id desc limit $total_count");
echo $_GET["jsoncall"].'({"posts": [';

while($row=mysql_fetch_array($sql))
{
$comments=$row['comments'];
echo '
{
"comments":"'.$comments.'",
},'; 
}

echo ']})';
}
?>

domain_css.css

*{margin:0px; padding:0px;}
ol.live-jsonbox {
font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
font-size:12px;
color:#FF3D3D;
list-style:none;
width:300px;
padding:10px 10px 25px 10px;
background:url(http://pakainfo.com/vue/live.jpg)
bottom right no-repeat;
background-color:#3D3D3D;
text-align:center
}
ol.live-jsonbox li { padding-bottom:4px}
ol.live-jsonbox li a{color:#80c8e5; text-decoration:none}
ol.live-jsonbox li a:hover{color:#80c8e5; text-decoration:underline}

Example

I hope you have Got What is How to access cross-domain data with AJAX using JSONP And how it works.I would Like to have FeadBack From My Blog(Pakainfo.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(Pakainfo.com) Are Most Always Welcome.

Leave a Reply

Your email address will not be published. Required fields are marked *