I'm having a problem parsing valid Json from a Twitter List then displaying the list on the page.
Here is my code;
var url = "http://api.twitter.com/1/aplusk/lists/5676047/statuses.json&callback=?";
$.getJSON(url, function(data) {
var results = '';
$(data.results).each(function() {
results += "<p class='tweet_result' id='tweet" + this.id_str + "'><a href='http://twitter.com/" + this.user.screen_name + "' title='' class='tweet_user'></p>";
});
$(results).prependTo("#twitter_results");
});
If you put the url in to www.jslint.com you can view the structure of the json
I'm new to json so I could be doing something stupid here.
Thanks in advance for your help and advice.
The URL has to be:
http://api.twitter.com/1/aplusk/lists/5676047/statuses.json?callback=?
(Note the question mark instead of the ampersand)
Also see the returned object, it does'nt have a member "results", it's a native javascript-array.
You'll have to iterate over data itself:
$(data).each(function(i,item)
where you can access the properties inside via
item.someProperty
Related
I want to get the result from a wikipedia page https://en.wikipedia.org/wiki/February_2 as JSON.
I tried using their API: https://en.wikipedia.org/w/api.php?action=parse&page=February_19&prop=text&formatversion=2&format=json
Though it is giving it as Json format. The content is HTML. I want only the content.
I need a way to get clean result.
If you want plain text without markup, you have first to parse the JSON object and then extract the text from the HTML code:
function htmlToText(html) {
let tempDiv = document.createElement("div");
tempDiv.innerHTML = html;
return tempDiv.textContent || tempDiv.innerText || "";
}
const url = 'https://en.wikipedia.org/w/api.php?action=parse&page=February_19&prop=text&format=json&formatversion=2&origin=*';
$.getJSON(url, function(data) {
const html = data['parse']['text'];
const plainText = htmlToText(html);
const array = [...plainText.matchAll(/^\d{4} *–.*/gm)].map(x=>x[0]);
console.log(array);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Update: I edited the code above according to the comment below. Now the function extracts all the list items putting them into an array.
I guess by clean you mean the source wikitext. In that case you can use the revisions module:
https://en.wikipedia.org/w/api.php?action=query&titles=February_2&prop=revisions&rvprop=content&formatversion=2&format=json
See API:Get the contents of a page and API:Revisions for more info.
I was wondering how I could display multiple rows of data in Firebase onto a blank page/simple website.
I am currently using this to display a simple string:"Testing" through this method:
var bigOne = document.getElementById('bigOne');
var dbRef = firebase.database().ref().child('text');
dbRef.on('value', snap => bigOne.innerText = snap.val());
How it looks in Firebase
How it looks on a blank site
But how can I display multiple lines/rows of data from Firebase onto the blank page?
With multiple lines/rows of data I mean this:
Firebase data
EDIT: This is my current code: Image
However it shows nothing on my HTML page. Do I have to add this line of code back or adjust it? If I add it back it says: [object Object] on the site.
dbRef.on('value', snap => bigOne.innerText = snap.val());
You should listen to a list of items and loop over the items:
First you should adapt your dbRef to
var dbRef = firebase.database().ref('sensor/dht');
then query as follow
var tempo = '';
dbRef.on('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
tempo += 'temp: ' + childSnapshot.val().temp + ' - humidity: ' + childSnapshot.val().humidity + '<br>'; //Just an example of formatting the output
});
bigOne.innerText = tempo;
});
Have a look a the doc at https://firebase.google.com/docs/database/web/lists-of-data#reading_and_writing_lists
I'm trying to use Yahoo Pipes to turn multiple tables inside a DIV into an array of JSON objects.
Below is what I currently have. The HTML is being parsed fine.
http://pipes.yahoo.com/pipes/pipe.edit?_id=cbd57c80e76b0a2973df0e8bbc357820
I want each of the table cells to be properties of of the JSON object. I believe this is possible with looping, however I can't figure out how to make this happen.
I figured this out using pure JS and the YQL API.
var yql_query = 'select * from html where url="http://www.scorespro.com/soccer/england/premier-league/2014-2015/standings/"';
yql_query += " and xpath='//*[#id=\"standings_1a\"]'";
yql_query = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent(yql_query) + '&format=html&callback=?';
$.getJSON(yql_query, function (data) {
// do something crazy the power is now yours! $(data.results[0])
});
I'm reading a csv file with the javascript File API. I want to display those data in a datalist ( html5 tag). I'm using the same code as in http://www.html5rocks.com/en/tutorials/file/dndfiles/. The array that is holding the csv data is named datacsv. I just don't know how to pass the array (datacsv[] at this case) into the datalist tag, in order to display the data. Any thoughts would be greatly appreciated, Thanks
You could try using jQuery:
var datacsv = ['example', 'of', 'some', 'data'];
for(var i in datacsv){
$('#my-datalist').append('<option value=' + datacsv[i] + '>');
}
In response to your comment, jQuery is a useful library for the client-side JavaScript language, so it will work off-line. If you're looking for a non-jQuery way of doing this, you can use this code:
var datacsv = ['example', 'of', 'some', 'data'];
for(var i in datacsv){
var datalist = document.getElementById('my-datalist');
datalist.innerHTML += '<option value=' + datacsv[i] + '>';
}
I'm having some trouble populating a dropdownlist with some JSON data, i suspect that the error occurs because of the way im appending the $.post within the #stuff div, but i've tried this a couple of ways and just wont get the hang of it.
The select id="" tag & the div lies within another view (it's not part of this particular document) , is that a problem for populating the dropdown-list this way?
Ive tried to alert out the "listItems" and i've got the option values etc... dont get it why it wont populate.
Any help would be appreciated.
Json-response from the $.post =
{"childrendata":[{"id":"42","parent":"1","fName":"hej","lName":"nisse","birthdate":"2011-10-21"}]}
The jQuery/js:
$("#stuff").append(function(){
$.post("show_relations", {},
function(data)
{
$("#stuff").empty();
json = eval('('+data+')');
if(data == '{"childrendata":[]}')
{
$("#stuff").append("No relations registered.");
}
else
{
var listItems= "";
for (var i = 0; i < json.childrendata.length; i++)
{
listItems+= "<option value='" + json.childrendata[i].fName + "'>" + json.childrendata[i].lName + "</option>";
}
$("#child_list").html(listItems);
}
});
});
});
Edit: Based on your comment, I'll assume your problem is purely single-page.
The problem with that code would appear to be the fact that you're trying to use .append() with a function (which is valid jQuery), but that the function doesn't return anything that jQuery can append to the 'stuff' node; $.post makes an Ajax call, which returns immediately.
Instead, try something like the following (modifying the URL to the Ajax call as required):
$.post("url/to/post/to", {},
function(data) {
$("#stuff").empty(); //Clear your stuff div
var children = data.childrendata; //jQuery automatically unserializes json
if(children.length == 0) {
$("#stuff").append("No relations registered.");
}
else {
$('#stuff').append('<select id="child_list"></select>');
$.each(children,
function(index, value) {
//Append each option to the selectbox
$("#child_list").append("<option value='" + value.fName + "'>" + value.lName + "</option>");
}
);
}
},
'json'
);
$.each() is the generic jQuery iterator, which helps de-clutter the code.
What this does is make an Ajax post to the provided URL, which responds with the serialized json object. The callback takes that response (which jQuery has already unserialized by itself), adds a new select to the '#stuff' div, and then adds the dynamically-created options to the new select.
Endnote: My apologies for not posting the link to the $.each documentation, StackOverflow only allows me to post 2 hyperlinks in a single post currently.