Display Cross Domain Data with Jquery JSON Callback.
<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://9lessons.net63.net/9lessons.json.js"></script>
<link href="http://9lessons.net63.net/9lessons_json.css" rel="stylesheet" type="text/css">
<ol id="9lessons" class="jsonbox"></ol>
<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://9lessons.net63.net/9lessons.json.js"></script>
<link href="http://9lessons.net63.net/9lessons_json.css" rel="stylesheet" type="text/css">
<ol id="9lessons" class="jsonbox"></ol>
9lessons.json.js
Javascript code read the JSON file.
$(document).ready(function()
{
$.getJSON("http://9lessons.net63.net/9lessons_json.php?count=5&jsoncall=?",function(data)
{
$.each(data.posts, function(i,data)
{
var jsondata ="<li>"+data.message+"</li>";
$(jsondata).appendTo("ol#9lessons");
});
}
);
return false;
});
9lessons_json.php
Contains PHP code displaying results from Messages table in JSON format.
9lessons_json.css
Javascript code read the JSON file.
$(document).ready(function()
{
$.getJSON("http://9lessons.net63.net/9lessons_json.php?count=5&jsoncall=?",function(data)
{
$.each(data.posts, function(i,data)
{
var jsondata ="<li>"+data.message+"</li>";
$(jsondata).appendTo("ol#9lessons");
});
}
);
return false;
});
9lessons_json.php
Contains PHP code displaying results from Messages table in JSON format.
<?php
include('config.php');
if($_GET['count'])
{
$count=$_GET['count'];
$count=mysql_real_escape_string($count);
$sql=mysql_query("select msg from messages order by msg_id desc limit $count");
echo $_GET["jsoncall"].'({"posts": [';
while($row=mysql_fetch_array($sql))
{
$message=$row['message'];
echo '
{
"message":"'.$message.'",
},';
}
echo ']})';
}
?>
include('config.php');
if($_GET['count'])
{
$count=$_GET['count'];
$count=mysql_real_escape_string($count);
$sql=mysql_query("select msg from messages order by msg_id desc limit $count");
echo $_GET["jsoncall"].'({"posts": [';
while($row=mysql_fetch_array($sql))
{
$message=$row['message'];
echo '
{
"message":"'.$message.'",
},';
}
echo ']})';
}
?>
9lessons_json.css
*{margin:0px; padding:0px;}
ol.jsonbox {
font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
font-size:11px;
color:#FFFFFF;
list-style:none;
width:300px;
padding:10px 10px 25px 10px;
background:url(http://9lessons.net63.net/jsonlogo.png)
bottom right no-repeat;
background-color:#333333;
text-align:left
}
ol.jsonbox li { padding-bottom:4px}
ol.jsonbox li a{color:#80c8e5; text-decoration:none}
ol.jsonbox li a:hover{color:#80c8e5; text-decoration:underline}
ol.jsonbox {
font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
font-size:11px;
color:#FFFFFF;
list-style:none;
width:300px;
padding:10px 10px 25px 10px;
background:url(http://9lessons.net63.net/jsonlogo.png)
bottom right no-repeat;
background-color:#333333;
text-align:left
}
ol.jsonbox li { padding-bottom:4px}
ol.jsonbox li a{color:#80c8e5; text-decoration:none}
ol.jsonbox li a:hover{color:#80c8e5; text-decoration:underline}
No comments:
Post a Comment