what is wrong with this JSON parsing using YQL?
i want to parse remote JSON file using JQuery, YQL(you know cross domain proble, so yql is best)
but i dont know what is misssing in this code ? index.html
<html开发者_开发知识库 lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
<style type="text/css">
body { text-align: center; }
</style>
</head>
<body onLoad="gova();">
<div id="container">
</div>
<table id="userdata" border="1">
<thead>
<th>First Name</th>
<th>Last Name</th>
<th>Email Address</th>
<th>City</th>
</thead>
<tbody></tbody>
</table>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="cross-domain-requests.js"></script>
<script type="text/javascript">
function gova() {
var path = $('http://mapleleafrealities.com/jsondata.php').val();
requestCrossDomain('http://mapleleafrealities.com/jsondata.php', function(results) {
$('#container').html(results);
});
return false;
}
</script>
</body>
</html>
cross-domain-requests.js
// Accepts a url and a callback function to run.
function requestCrossDomain( site, callback ) {
// If no url was passed, exit.
if ( !site ) {
alert('No site was passed.');
return false;
}
// Take the provided url, and add it to a YQL query. Make sure you encode it!
var yql = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent('select * from html where url="' + site + '"') + '&format=xml&callback=?';
// Request that YSQL string, and run a callback function.
// Pass a defined function to prevent cache-busting.
$.getJSON( yql, cbFunc );
function cbFunc(data) {
// If we have something to work with...
if ( data.results[0] ) {
// Strip out all script tags, for security reasons.
// BE VERY CAREFUL. This helps, but we should do more.
data = data.results[0].replace(/<script[^>]*>[\s\S]*?<\/script>/gi, '');
// If the user passed a callback, and it
// is a function, call it, and send through the data var.
if ( typeof callback === 'function') {
callback(data);
}
}
// Else, Maybe we requested a site that doesn't exist, and nothing returned.
else throw new Error('Nothing returned from getJSON.');
}
}
i want to display unformatted data in to table ? how ? plese give solution where is the probleam or what is missing ?
thanks in advance !! :)
i want to parse remote JSON file using JQuery, YQL
You say that you want to parse some JSON, but your YQL query asks for HTML and the YQL URL asks for an XML response!
var yql = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent('select * from html where url="' + site + '"') + '&format=xml&callback=?';
If you really want to work with JSON, change that line to something like below. It a) uses the json
table (since that is the nature of the content on the site
) and b) tells YQL to return JSON because you're using the jQuery.getJSON()
function!
var yql = 'http://query.yahooapis.com/v1/public/yql?'
+ 'q=' + encodeURIComponent('select * from json where url=@url')
+ '&url=' + encodeURIComponent(site)
+ '&format=json&callback=?';
Now that YQL returns JSON, you can get at the json
object via data.query.results.json
which then contains an array of userdata
objects. See a fuller example, based on your code, which takes the JSON response from YQL and populates the table rows using jQuery.template()
http://jsbin.com/umuri5/edit
Two thins:
1)The json being returned in not well formed. For some reason the userdata element is prefixed with "\n
, hence making the element userdata unavailable,
2)You should be using data.results[0].userdata to iterate over each user. i.e:
$.each(data.results[0].userdata, function(i,user){
var tblRow =
"<tr>"
+"<td>"+user.first+"</td>"
+"<td>"+user.last+"</td>"
+"<td>"+user.email+"</td>"
+"<td>"+user.city+"</td>"
+"</tr>"
$(tblRow).appendTo("#userdata tbody");
});
精彩评论