Issue related to getting value from AJAX Call in Famo.us - javascript

I am new in Famo.us framework. i have small Application in Famo.us framework.
I have following Code:
define(function (require, exports, module) {
var Surface = require('famous/core/Surface');
var Modifier = require('famous/core/Modifier');
var Transform = require('famous/core/Transform');
var View = require('famous/core/View');
var HeaderFooterLayout = require('famous/views/HeaderFooterLayout');
var App = require('./App');
var apps = [];
GetContent.prototype = Object.create(View.prototype);
GetContent.prototype.constructor = GetContent;
GetContent.DEFAULT_OPTIONS = {};
function GetContent() {
View.apply(this, arguments);
GetData();
}
function GetData() {
$.ajax({
type: "GET",
url: "/LocalPlatFormService.svc/GetJobRCompanies",
contentType: "application/json; charset=utf-8",
success: ajaxCallSucceed,
dataType: "json"
});
}
function ajaxCallSucceed(response) {
var finalStr = '';
var a = response[0].Success;
if (a.toString().toLowerCase() == "true") {
for (var i = 0; i < response.length; i++) {
var strId = response[i].Id;
var strSuccess = response[i].Success;
finalStr += i + '.' + strId + ' , ' + strSuccess + ' ';
var app1 = new App({});
app1.AddPages(response[i].ImageLarge, response[i].Description, response.length, i);
apps.push(app1);
}
}
else {
alert("No Data Found.");
}
}
module.exports = GetContent;
});
The Ajax call in GetData() is works fine, and it also calls ajaxCallSucceed() on successful Call. but problem is that ajaxCallSucceed() executes after executing all other function, even after executing module.exports = GetContent; in last line.
I want to bind some values in ajaxCallSucceed() based on getting data from database
but how to fetch value from ajaxCallSucceed(), as it is executing after all other operation.
Thanks.

Set ajax async to false. Like this:
$.ajax({
type: "GET",
async: false,
url: "/LocalPlatFormService.svc/GetJobRCompanies",
contentType: "application/json; charset=utf-8",
success: ajaxCallSucceed,
dataType: "json"
});
Setting async to false means that the statement you are calling has to complete before the next statement in your function can be called. If you set async: true then that statement will begin it's execution and the next statement will be called regardless of whether the async statement has completed yet.

Related

How do I override JSON errors and prevent a blank page from loading?

How do I prevent my JSON feed from crashing and ignore errors from a database if they occur while running, also how do I change the undefined errors into a string to return as a fall back like "pending" or "not available."
I tried inputting the Try, catch, finally method. Also, the If statements conditional equal and null ones I found to change undefined into a "string"
var flight = document.getElementById("flight");
var time = document.getElementById("time");
var airline = document.getElementById("airline");
var stat = document.getElementById("status");
var cities = document.getElementById("cities");
//Loading the document
//this is for updating the url
var url = './airport-test.json';
//var url = './proxy.php';
$(document).ready(function () {
$.ajax({
type: "GET",
dataType: "json",
url: url,
async: true,
contentType: "application/json; charset=utf-8",
cache: false,
success: function (data) {
var flightString = "";
var timeString = "";
var airlineString = "";
var statString = "";
var citiesString = "";
if(data) {
try {
var a = JSON.parse(data);
console.log(a);
} catch(e) {
var errorMessage = e.name + '' + e.message;
console.log(errorMessage);
}
}
for (i= 0,l = data.length = 16; i < l; i++ ) {
code here I erased to fit this question better...
}
flight.insertAdjacentHTML('beforeend', flightString);
time.insertAdjacentHTML('beforeend', timeString);
airline.insertAdjacentHTML('beforeend', airlineString);
stat.insertAdjacentHTML('beforeend', statString);
cities.insertAdjacentHTML('beforeend', citiesString);
}});
});
I am using a raspberry pi with chromium I just want the JSON feed to still show up even when there is an error instead of a blank page. It works most of the time. Also, want to change undefined from errors into a fallback string.
Not totally sure what exactly is the problem, taking a wild guess the server is not responding properly.
Define error handler,
$.ajax({
type: "GET",
dataType: "json",
url: url,
async: true,
contentType: "application/json; charset=utf-8",
cache: false,
success: function (data) {
....
}
error: function (error) {
// handle your error here.
....
}

Cannot read property of undefined after JSON parse

I have done an ajax request in my code and it works good. After that I want to extract only the necessary info and re-post it to another script. Until now here is my code:
$.ajax({
type: "POST",
url: url,
data: {xhr_id: xhr_id},
success: function (jsondata) {
var product_data = [];
for (var i = 0; i <= 3; i++) {
//alert(jsondata.products[i].product_description.toSource());
product_data[i] = {};
product_data[i]["product" + i] = jsondata.products[i].product_description;
//alert(product_data[i]["product" + i].toSource());
}
},
dataType: "json"
});
The problem is that both the alerts work fine, displaying the information I want. However, I get an error message of "Uncaught TypeError: Cannot read property 'product_description' of undefined" which breaks the script and prevents me from doing anything else. What am I doing wrong, any ideas?
'product_description' of undefined" what it means is that your are trying to access property on undefined variable. That implies "jsondata.products[i]" resulted in undefined value which have occured due to index out of range.How many records are returned in jsondata 3 or 4,check and adjust the condition in for loop
The parameter in the success() function of $.ajax is a string. You have to put it through a parse function to make json. See your code below modified but not tested.
$.ajax({
type: "POST",
url: url,
data: {xhr_id: xhr_id},
success: function (jsondata) {
var oData;
try { oData=jQuery.parseJSON(jsondata) }
catch(err) {
alert("Problem parsing json string : " + jsondata)
return false
}
var product_data = [];
for (var i = 0; i <= 3; i++) {
//alert(oData.products[i].product_description.toSource());
product_data[i] = {};
product_data[i]["product" + i] = oData.products[i].product_description;
//alert(product_data[i]["product" + i].toSource());
}
},
dataType: "json"
});

using javascript to load json data from google maps

So, this is the code I have, console.log gives me the right value, but the function doesn't return the value, even if the return is inside the timeout. I must be doing something wrong.
function countyfinder(address){
var rr =$.getJSON('https://maps.googleapis.com/maps/api/geocode/json?address=' + address.replace(" ", "%20")).done(function(data) {
var county = data.results[0].address_components[3].short_name;
//return county;//data is the JSON string
});return rr;};
function calculatetax(address, price){
var j = countyfinder(address);
setTimeout(function(){var k = j["responseJSON"]['results'][0]['address_components'][3]['short_name'];
console.log(k);//return k won't work in here either
}, 1000); return k
};
this is what I ended up with:
var jq = document.createElement('script');
jq.src = "//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
function getCounty(address) {
var country;
var baseApiUrl = "https://maps.googleapis.com/maps/api/geocode/json";
var query = "?address=" + encodeURIComponent(address);
var queryUrl = baseApiUrl + query;
$.ajax({
url: queryUrl,
async: false,
dataType: 'json',
success: function(data) {
county = gmapsExtractByType(data, "administrative_area_level_2 political");
}
});
return countr.long_name;
}
function gmapsExtractByType(json, type) {
return json.results[0].address_components.filter(function(element) {
return element.types.join(" ") === type;
})[0];
}
console.log( getCounty("100 wacko lane ohio") );
I had to use a synchronous request by changing some settings in the ajax request. The drawback of this is that the browser will be locked up until you get a request response, which can be bad on a slow connection or a connection with an unreliable server. With google, most of the time, I don't think that will happen.

Selebiun Crawler Timeout Issues C#

The following code I am running and during execution I receive an error.
public void GetCategoriesSelenium() {
string javascript = System.IO.File.ReadAllText(#"GetCategory.js");
CrawlerWebSeleniumJS.ExecuteScript("var finished;");
CrawlerWebSeleniumJS.ExecuteScript("var all_categories;");
CrawlerWebSeleniumJS.ExecuteScript("finished = false;");
CrawlerWebSeleniumJS.ExecuteScript("all_categories = [];");
CrawlerWebSelenium.Manage().Timeouts().SetScriptTimeout(TimeSpan.FromDays(1));
CrawlerWebSelenium.Manage().Timeouts().SetPageLoadTimeout(TimeSpan.FromDays(1));
CrawlerWebSelenium.Manage().Timeouts().ImplicitlyWait(TimeSpan.FromDays(1));
AddToConsole("CRAWLER: GET - Categories");
try {
CrawlerWebSeleniumJS.ExecuteScript(javascript);
}
catch {
}
int ready = 2;
for (int i = 0; i < ready; i++) {
try {
if (CrawlerWebSeleniumJS.ExecuteScript("return finished").ToString() == "True") {
i = i++ + ready++;
}
else {
ready++;
}
}
catch {
}
}
AddToCatsTreeSelenium();
}
$('.p-pstctgry-lnk-ctgry').each(function (i) {
var idBits = this.id.split('_');
var theId = idBits[1];
var theTitle = this.text;
var subcategories = [];
//initiate ajax request for json results
$.ajax({
async: false,
type: 'GET',
dataType: 'json',
url: 'URL REMOVED',
data: {
nodeType: 'cat',
level1id: theId
}
}).done(function (theJSON1) {
var thelength1 = Object.keys(theJSON1['items']).length;
//loop through found subs
for (var i = 0; i < thelength1; i++) {
//start of next recursive block to copy and paste inside
var subsubcategories = [];
//initiate ajax request for sub json results
$.ajax({
async: false,
type: 'GET',
dataType: 'json',
url: 'URL REMOVED',
data: {
nodeType: 'cat',
level1id: theId,
level2id: theJSON1['items'][i]['id']
}
}).done(function (theJSON2) {
var thelength2 = Object.keys(theJSON2['items']).length;
for (var k = 0; k < thelength2; k++) {
//start of next recursive block to copy and paste inside
var subsubsubcategories = [];
//initiate ajax request for sub json results
if ((theJSON2['items'][k]['id'] != 'OFFER') && (theJSON2['items'][k]['id'] != 'WANTED')) {
$.ajax({
async: false,
type: 'GET',
dataType: 'json',
url: 'URL REMOVED',
data: {
nodeType: 'cat',
level1id: theId,
level2id: theJSON1['items'][i]['id'],
level3id: theJSON2['items'][k]['id']
}
}).done(function (theJSON3) {
var thelength3 = Object.keys(theJSON3['items']).length;
for (var l = 0; l < thelength3; l++) {
console.log('---' + theJSON3['items'][l]['value'] + ' ' + theJSON3['items'][l]['id']);
//store this subsub
subsubsubcategories.push({
title: theJSON3['items'][l]['value'],
id: theJSON3['items'][l]['id'],
sub: ''
});
}
//end done theJSON
});
}
//end of next recursive block to copy and paste inside
console.log('--' + theJSON2['items'][k]['value'] + ' ' + theJSON2['items'][k]['id']);
//store this subsub
subsubcategories.push({
title: theJSON2['items'][k]['value'],
id: theJSON2['items'][k]['id'],
sub: subsubsubcategories
});
}
//end done theJSON
});
console.log('-' + theJSON1['items'][i]['value'] + ' ' + theJSON1['items'][i]['id']);
//store this sub with -> subsub
subcategories.push({
title: theJSON1['items'][i]['value'],
id: theJSON1['items'][i]['id'],
sub: subsubcategories
});
//end of next recursive block to copy and paste inside
//end sub loop
}
console.log('' + theTitle + ' ' + theId);
//store this cat with -> sub -> subsub
all_categories.push({
title: theTitle,
id: theId,
sub: subcategories
});
console.log(all_categories);
//end first json subcat loop
});
//end main cat scan loop
});
finished = true;
The above code is the method that I run and the code that is under it is pure javascript that is being run through selenium.
So issue one, when the code is run selenium locks up. Which I can understand. This process takes about 4mins. After 60secs it times out with the error
The HTTP request to the remote WebDriver server for URL timed out after 60 seconds.
Which is really annoying and locks the system up. I know a really quick and easy way to get this fixed. (Thread.Sleep(300000) which is disgusting...
My thoughts are, maybe it is running a javascript query and waiting for it to finish and I am constantly pounding Selenium with more javascript requests which time out as expected.
Any other thoughts?
The driver's constructor should have an overload that includes a TimeSpan indicating the timeout for the HTTP client used by the .NET bindings to communicate with the remote end. Setting that to an appropriately large value should be sufficient to let the operation complete.

jQuery Ajax call in loop losing local variable reference

I am making several jQuery ajax calls within a loop. Each time one of the ajax calls return I need to reference a value corresponding to the original ajax call. My current code doesn't work properly, in that the value of the lskey variable has been altered by further loop iterations.
Here is the code:
for (var i = 0, len = localStorage.length; i < len; i++) {
var lskey = localStorage.key(i);
if (lskey.substr(0, 4) === 'form') {
var postdata = localStorage.getItem(lskey); // Get the form data
$.ajax({
type: "POST",
async: "false",
url: "/Profile/PostForm",
data: postdata,
success: function (data) {
$('#rollinginfo').append('<br>' + data + ',key=' + lskey);
localStorage.removeItem(lskey); // Remove the relevant localStorage entry
}
, error: function (data) { $('#rollinginfo').append('<br />ERR:' + data); }
});
}
}
The problem is that lskey is being altered each time the loop executes, and therefore the success callback does not have a reference to the value of lskey that existed at the time of the call.
How do I reference the correct value of lskey for each success callback?
for (var i = 0, len = localStorage.length; i < len; i++) {
var lskey = localStorage.key(i);
if (lskey.substr(0, 4) === 'form') {
var postdata = localStorage.getItem(lskey); // Get the form data
$.ajax({
type: "POST",
async: "false",
url: "/Profile/PostForm",
data: postdata,
local_lskey: lskey
success: function (data) {
$('#rollinginfo').append('<br>' + data + ',key=' + lskey);
localStorage.removeItem(this.local_lskey); // Remove the relevant localStorage entry
}
, error: function (data) { $('#rollinginfo').append('<br />ERR:' + data); }
});
}
}
This should work.
In the end I added the key info to the server posting, and then returned it from the server in JSON format so the success function could then simply refer to the key contained in the server response.
Have you considered chaining the AJAX calls? Basically you can make one AJAX call, process the result, modify lskey, etc. Then when you are ready, increment i and issue the second AJAX call. Loop this way instead of using the for loop...
You could put your ajax call into its own function and pass the lskey and postData values in. That way localStorage.removeItem(lskey) will refer to the lskey variable in the context of the function rather than the context of the loop.
Example
Declare the function -
function postForm(postdata, lskey) {
$.ajax({
type: "POST",
async: "false",
url: "/Profile/PostForm",
data: postdata,
success: function(data) {
$('#rollinginfo').append('<br>' + data + ',key=' + lskey);
localStorage.removeItem(lskey); // Remove the relevant localStorage entry
},
error: function(data) {
$('#rollinginfo').append('<br />ERR:' + data);
}
});
}
Then you can call your function from your loop -
for (var i = 0, len = localStorage.length; i < len; i++) {
var lskey = localStorage.key(i);
if (lskey.substr(0, 4) === 'form') {
var postdata = localStorage.getItem(lskey); // Get the form data
postForm(postdata, lskey);
}
}
You could also declare the function just before the loop (assigning it to a variable) and then call it within the loop.
var postForm = function(postdata, lskey) {
$.ajax({
type: "POST",
async: "false",
url: "/Profile/PostForm",
data: postdata,
success: function(data) {
$('#rollinginfo').append('<br>' + data + ',key=' + lskey);
localStorage.removeItem(lskey); // Remove the relevant localStorage entry
},
error: function(data) {
$('#rollinginfo').append('<br />ERR:' + data);
}
});
}
for (var i = 0, len = localStorage.length; i < len; i++) {
var lskey = localStorage.key(i);
if (lskey.substr(0, 4) === 'form') {
var postdata = localStorage.getItem(lskey); // Get the form data
postForm(postdata, lskey);
}
}

Categories

Resources