<div id="pizza" class="yui3-skin-sam dt-example"></div>
<script>
YUI().use("datasource-get", "datasource-jsonschema", "datatable-base-deprecated", "datatable-datasource-deprecated", function (Y) {
var url = "http://query.yahooapis.com/v1/public/yql?format=json" +
"&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys",
query = "&q=" + encodeURIComponent(
'select * from local.search ' +
'where zip = "94089" and query = "pizza"'),
dataSource,
table;
dataSource = new Y.DataSource.Get({ source: url });
dataSource.plug(Y.Plugin.DataSourceJSONSchema, {
schema: {
resultListLocator: "query.results.Result",
resultFields: [
"Title",
"Phone",
{
key: "Rating.AverageRating",
// YQL is returning "NaN" for unrated restaurants
parser: function (val) {
return isNaN(val) ? '(none)' : val;
}
}
]
}
});
table = new Y.DataTable.Base({
columnset: [
"Title",
"Phone",
{ key:"Rating.AverageRating", label:"Rating" }
],
summary: "Pizza places near 98089",
caption: "Table with JSON data from YQL"
});
table.plug(Y.Plugin.DataTableDataSource, { datasource: dataSource });
table.render("#pizza");
table.datasource.load({ request: query });
});
</script>