({"message":"You got an AJAX response via JSONP from another site!"})<!DOCTYPE html>
<html>
<head>
<title>jQuery JSONP Example </title>
	<link href="jquery/ui/css/ui-lightness/jquery-ui-1.7.1.custom.css" type="text/css" rel="stylesheet" />
	<script src="jquery/core/jquery-1.4.2.min.js" type="text/javascript"></script>
	<script src="jquery/ui/jquery-ui-1.7.1.custom.min.js" type="text/javascript" ></script>
	<script src="jquery/plugins/feedback/jquery.feedback-1.0.1.js" type="text/javascript" ></script>
<style>	
body, table, tr, td {
	font-size:12px;
}

body, h1-h6, table, tr, td, input, submit, button, textarea, select {
	font-family:Verdana,Arial,Sans-serif;
}
 
p { 
	font-family:	Trebuchet MS,Helvetica,Arial,sans-serif;
	font-size:	12px 
}
 
.custom {border: 2px solid green; background-color: yellow; color: #666666;} 
 
.codeexample  { 
	font-family: courier, courier-new; 
	font-size:12px; border: 1px solid gray; margin: 10px; 
	background-color: EFEFEF; 
	}

</style> 

<script> 
$(document).ready(function() {
 $("#jsonpbtn").click(function() {
	var surl =  "http://www.fbloggs.com/sandbox/jsonp.php?callback=?"; 
	var me = $(this); 
	$.getJSON(surl,  function(rtndata) { 
		me.feedback(rtndata.message, {duration: 4000, above: true});
    }); 
 });
 
 
  $("#jsonpbtn2").click(function() {
	var surl =  "http://www.fbloggs.com/sandbox/jsonp.php"; 
	var id = $(this).attr("id"); 
	$.ajax({
		url: surl, 
		data: {id: id},
		dataType: "jsonp",
		jsonp : "callback",
		jsonpCallback: "jsonpcallback"
		}); 
 });
 
 
 
}); 

// Named callback function from the ajax call when jsonpbtn2 clicked
function jsonpcallback(rtndata) { 

	// Get the id from the returned JSON string and use it to reference the target jQuery object.
	var myid = "#"+rtndata.id; 
	$(myid).feedback(rtndata.message, {duration: 4000, above: true});
}

</script>
</head>
<body>
<h1>jQuery JSONP Example</h1>
<p>Click the button to see some feedback returned from another server using JSONP:</p>
<button id="jsonpbtn">Click me!</button>
<br/>
<p>Another example using a named callback function:</p>
<button id="jsonpbtn2">Click me too!</button>
<div style="margin-top:30px"> 
The php code is: 
<br/> 
<pre class="codeexample">
&lt;?php
header(&quot;content-type: application/json&quot;); 

// Create a generic object.
// Assign it the properties of id (optional - id of target HTML element, from URL) 
// and 'message' - the feedback message we want the user to see. 
if (isset($_GET['id'])) $rtnjsonobj-&gt;id = $_GET['id']; 
$rtnjsonobj-&gt;message = &quot;You got an AJAX response via JSONP from another site!&quot;;


// Wrap and write a JSON-formatted object with a function call, using the supplied value of parm 'callback' in the URL: 
echo $_GET['callback']. '('. json_encode($rtnjsonobj) . ')';    

?&gt;
</pre> 
</div>
</body> 
</html>
