Phonegap - Local storage for JSON - json

I have followed a tutorial on how to locally store a json feed for offline use (see link below).
http://samcroft.co.uk/2013/using-localstorage-to-store-json/
I implemented the code but unfortunately it didn't work. The json feed is stored but there seems to be a problem retrieving it. I don't have any errors, the feed just doesn't appear.
$.ajax({
url: 'path/to/json',
dataType: 'jsonp',
jsonp: 'jsoncallback',
cache: true,
timeout: 5000,
success: function(data, status){
var localData = JSON.parse(window.localStorage.getItem('events'));
$.each(function(key, value){
//do the do
});
var localData = JSON.stringify(data);
window.localStorage.setItem('events', localData);
},
error: function(){
app.showAlert('Something has gone wrong. Please report this issue or check back later.', 'Error');
},
complete: function(){
$('.scroll').removeClass('loading');
}
});
Does anyone have any ideas why this might be happening?
Thanks

Related

Ajax requesting an API for data on a project

So I am busy with a private coding project right now, but can't seem to get my code to work properly.
I want to in essence, get data from my API and display it on to my HTML page, the data type is set to "jsonp" because of CORS errors( this was the only way I could debug it ), anyone have an idea of how I can get this to return usable data for my project?
function fetch(){
"use strict";var url = "https://api.pandascore.co/lol/champions?token=*my_unique_token*";
$.ajax({
url: url,
type: "GET",
crossDomain: true,
dataType: 'jsonp',
contentType: "application/json; charset=utf-8",
beforeSend: function(xhr){
xhr.setRequestHeader('Access-Control-Allow-Origin','*');
},
success: function(data){
console.log(data);
},
done: function(data){
console.log(data);
},
error: function(error){
console.log(error);
}
});
}
Edit:
This is a parsing problem, I cant get the code to log the success, I can see a response but its for my error log, but it doesn't show the success log, so the data is unusable.
Why not try the vanilla fetch method?
const url = 'https://api.pandascore.co/lol/champions?token=my_unique_token';
fetch(url)
.then(response => response.json())
.then(data => console.log(data))
This code should handle parsing JSON data you receive from pandascore. Fetch is not available in IE11, but there should be some polyfills lying around on the web.

Laravel - Ajax error: xhr.send( options.hasContent && options.data || null );

When I refresh the document, sometimes is working fine (I get the json object in console), but many times I get 500 (Internal Server Error) and from jQuery I see the error is: xhr.send( options.hasContent && options.data || null ); Please help me. Here is the code:
$(document).ready(function(){
$.ajax({
url: '/ajax/cis',
method: "GET",
success: function(data){
console.log(data);
}
});
});
'/ajax/cis' is a laravel controller wich only returns a json object:
return response()->json(['cis_names'=>'cis_names']);
I also tried with post method:
$.ajax({
url: '/ajax/cis',
method: "POST",
data:{_token: token},
//var token = Session::token()
success: function(data){
console.log(data);
}
});
Try this with using Blade and see if that works:
$.ajax({
url: '/ajax/cis',
method: "POST",
data:{_token: '{{csrf_token()}}'},
success: function(data){
console.log(data);
}
});

JSON API to HTML

I try using different instructions to use a JSON API from a Wordpress-System in a HTML-Teamplate. Unfortunately I do not succeed. Does anyone have any idea how I can read the section "Content" of http://www.earnyour21.de/api/get_page/?id=1588?
blog: function () {
$.ajax({
url: 'http://www.earnyour21.de/api/get_page/?id=1588',
type: 'GET',
dataType: 'json',
success: function (data) {
console.log(data);
},
error: function (data) {
console.log(data);
}
});
}
If the data structure of the JSON will always be the same, you can simply access the object directly using the objects name in JS.
blog: function(){
$.ajax({
url: 'http://www.earnyour21.de/api/get_page/?id=1588',
type: 'GET',
dataType: 'json',
success: function(data){
$('#content_test').append(data['page']['content']);
},
error: function(data){
$('#content_test').append(data['page']['content']);
}
});
}
Basically you need to use jquery to grab the div with an id of content_test and then append your data from the json. http://api.jquery.com/append/ and http://www.json.com/ for further reference.

Chrome extension transfer to manifest 2 - No ajax response

Hayush!
Been trying to transfer my Chrome extension to manifest 2. Everything is working except for one script which calls an ajax. I have a variable that contains a JSON content which needs to be transferred to the server.
function sendlist(list){
jsontext = JSON.stringify(list);
$.ajax({
url: amfurl + "user/listbookmarks/",
dataType: 'text json',
async: true,
type: 'POST',
processData: false,
data: {'folders': jsontext},
success: function(data){
$('#importing').css('display','none');
$('#importdone').css('display','block');
console.log(data);
},
error: function(xhr, status, error) {
var err = eval("(" + xhr.responseText + ")");
alert(err.Message);
}
});
}
For some reason the ajax part is not executed at all. No error message was triggered, nor in the server error log.
All of the inline scripts and scripts in general were included in the popup.js. So it's probably not the issue.
Any thoughts?
Thanks!
The following code works perfectly on previous manifest
function importbookmarks(){
$('#formadd').css('display','none');
$('#importing').css('display','block');
_gaq.push(['_trackEvent', 'chromextension','importbookmarks', username]);
chrome.bookmarks.getTree(function(bookmarks) {
sendlist(bookmarks);
});
}
function sendlist(list){
jsontext = JSON.stringify(list);
$.ajax({
url: amfurl + "user/listbookmarks/",
dataType: 'text json',
async: true,
type: 'POST',
// processData: false,
data: {'folders': jsontext},
success: function(data){
$('#importing').css('display','none');
$('#importdone').css('display','block');
console.log(data);
}
});
}
The problem wasn't with the function. The button execution wasn't calling it correctly.
Here is the code I used to get the function to work in manifest 2
document.addEventListener("DOMContentLoaded", function () {
document.getElementById("import-bookmarks").addEventListener("click", function () {
importbook();return;
});

Using jQuery to get jsonp data returns invalid label error

I have been using jquery ajax method to get the json data. I have used both jQuery.getJSON
and jquery.ajax methods but I keep getting the same error in my console. Invalid label meta I just want to display the some of the json data inside a div , is there something
wrong with the json file the java script works fine with other json files. I dont know how to parse this particular json file.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type = text/javascript>
$(document).ready(function(){
$.ajax({
url: 'http://api.yipit.com/v1/deals/?key=TMBYhd3hkzfCntMb&limit=20&division=boston',
dataType: 'jsonp',
success: function(data){
console.log(data);
}
});
return;
});
</script>
I just tried to parse the data but I am not able to see the result.
In the console I get a error saying field.deals.url not defined ?
I am also able to see jQuery16209054896509423064_1311611178838({ on top of the
meta how can I parse this file ?
<script type = text/javascript>
$(document).ready(function(){
$.ajax({
url: 'http://api.yipit.com/v1/deals/?key=TMBYhd3hkzfCntMb&limit=20&division=boston&callback=?',
dataType: 'jsonp',
success: function(data){
$.each(data.response, function(i, field){
$('#display').append('<p>url : ' + field.deals.url+ '</p>');
if ( i == 3 ) return false;
});
}
});
return;
});
</script>
Delete jsonp: false, you have to use JSONP in this cross domain case.
This will work:
$(document).ready(function(){
$.ajax({
url: 'http://api.yipit.com/v1/deals/?key=TMBYhd3hkzfCntMb&limit=20&division=boston',
dataType: 'jsonp',
success: function(data){
console.log(data);
}
});
});
Working example: jsFiddle
EDIT:
deals is your iterator not response
success: function(data){
$.each(data.response.deals, function(i, field){
$('#display').append('<p>url : ' + field.url+ '</p>');
if ( i == 3 ) return false;
});