JSONP error, Uncaught SyntaxError - javascript

I'm getting SyntaxError but works fine with other links. any idea???
function loadData() {
var wikiUrl = 'http://www.masslottery.com/data/json/search/dailygames/history/15/201711.json';
//http://www.masslottery.com/data/json/search/dailygames/history/15/201711.json?callback=jQuery1111019608043600812386_1511241988068&_=1511241988069
$.ajax({
url: wikiUrl,
dataType: "jsonp",
}).done(function (response) {
for (var i = 0; i < response; i++) {
console.log(response);
}
}).fail(function () {
// console.log(response);
});
return false;
};
$('#form-container').submit(loadData);

$.ajax({
url:"your link"
method: "get" or "post"
dataType: "json" or "jsonp"
}).done(function(res) {
console.log(res);
}).fail(function(error) {
console.log(error);
});
you missed method.

Related

JavaScript is not a function

I'm trying to write the following so that I can initiate Game by calling Game.init() but I keep getting:
Uncaught TypeError: Game.init is not a function
var Game = function() {
return {
init: function(url) {
$.ajax({
type: 'GET',
url: url,
dataType: 'json',
success: function(response) {
console.log(response);
}
});
},
success: function(response) {
console.log(response);
}
}
}
$(function() {
Game.init('./file.json');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
As VLAZ pointed out it has to be Game().init() or else you can make a immediately invoking function expression
var Game = (function() {
return {
init: function(url) {
console.log('test')
$.ajax({
type: 'GET',
url: url,
dataType: 'json',
success: function(response) {
console.log(response);
}
});
},
success: function(response) {
console.log(response);
}
}
}())
$(function() {
Game.init('./file.json');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Try this:
var Game = (function () {
return {
init: function (url) {
$.ajax({
type: 'GET',
url: url,
dataType: 'json',
success: function(response) {
console.log(response);
}
});
},
success: function(response) {
console.log(response);
}
}
})()
Game is a function not an object
$(function () {
Game().init('./file.json');
});

Html for response when i want a string

I have the function below:
function getHtmlFromMarkdown(markdownFormat, requestUrl) {
const dataValue = { "markdownFormat": markdownFormat }
$.ajax({
type: "POST",
url: requestUrl,
data: dataValue,
contentType: "application/json: charset = utf8",
dataType: "text",
success: function (response) {
alert(response);
document.getElementById("generatedPreview").innerHTML = response;
},
fail: function () {
alert('Failed')
}
});
}
And i have this on my server:
[WebMethod]
public static string GenerateHtmlFromMarkdown(string markdownFormat)
{
string htmlFormat = "Some text";
return htmlFormat;
}
I have on response html code, not the string that i want. What am I doing wrong?
And if i change the "dataType: json" it doesn't even enter either the success nor fail functions
Your data type of ajax must be json like this
function getHtmlFromMarkdown(markdownFormat, requestUrl) {
var dataValue = { "markdownFormat": markdownFormat }
$.ajax({
type: "POST",
url: requestUrl,
data: JSON.stringify(dataValue),
dataType: "json",
success: function (response) {
alert(response);
document.getElementById("generatedPreview").innerHTML = response;
},
error: function () { alert("Failed"); }
});
}
try with this.
function getHtmlFromMarkdown(markdownFormat, requestUrl) {
var obj={};
obj.markdownFormat=markdownFormat;
$.ajax({
type: "POST",
url: requestUrl,
data: JSON.stringify(obj),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert(response.d);
document.getElementById("generatedPreview").innerHTML = response.d;
},
failure: function () {
alert('Failed')
}
});
}

How to access json response that have the following format

I get a response like this:
{
"data": [
"http:\/\/www.domain.com.br\/anunciantes\/jorgediaz.y.com.r\/26\/img1.jpg",
"http:\/\/www.domain.com.br\/anunciantes\/jorgediaz.t.com.r\/26\/img2.jpg"
]
}
I have tried:
$.ajax({
url: "/imovel/recuperar_fotos",
datatype: 'JSON',
contentType: 'JSON',
success: function (data) {
var i = 0;
while(i < 3)
{
alert(data[i]);
i++;
}
}
});
and also data[0][i] doesn't work.
It is because you are receiving an object that has a data property that is an array. Therefore you could iterate over response.data (or data.data, following your code naming).
Here you have 3 ways to iterate over an array (and avoid the while loop)
Using array's forEach method
$.ajax({
url: "/imovel/recuperar_fotos",
datatype: 'JSON',
contentType: 'JSON',
success: function (response) {
var photos = response.data;
photos.forEach(function(photo) {
console.log(photo);
})
}
});
Using the for ... in
$.ajax({
url: "/imovel/recuperar_fotos",
datatype: 'JSON',
contentType: 'JSON',
success: function (response) {
var photos = response.data;
for (var i in photos) {
console.log(photos[i]);
}
}
});
Using the classig for loop
$.ajax({
url: "/imovel/recuperar_fotos",
datatype: 'JSON',
contentType: 'JSON',
success: function (response) {
var photos = response.data;
for (var i = 0; i < photos.length; i++) {
console.log(photos[i]);
}
}
});
Try this
$.ajax({
url: "/imovel/recuperar_fotos",
contentType: 'application/json',
success: function(res) {
for (i = 0; i < res.data.length; i++) {
alert(res.data[i]);
}
}
});

How do keep calling API using jQuery ajax if failed until three times?

Below is my jQuery ajax sample code
$.ajax({
url: 'http://api.test.com',
method: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: data
})
.done(function(returnObj) {
return returnObj;
})
.fail(function(err) {
console.log(err);
});
If failed, I will console log the error message, but how do I keep calling until three times failed and stop calling again and alert some message?
Leveraging promises, you could just do it this way. Might not be particularly elegant, but it works quite well and is very readable:
var func = function() {
return $.ajax(...);
};
func() //call 1
.then(null,function() { return func(); }) //call 2
.then(null,function() { return func(); }) //call 3
.then(null,function() { console.log('3 times'); })
EDIT:
If you are using jQuery less than 1.8, you'll have to change .then to .pipe
var repeat = function(request,times) {
var r = request();
while( times > 0) {
r = r.then(null,function() { return request(); })
times--;
}
return r;
}
repeat($.ajax.bind(null,{url:'https://www.google.com'}),10)
.then(
function() {
console.log('success!');
},
function() {
console.log('failed 10 times');
}
);
try this, (using recursion)
var counter = 1;
var ajaxFunc = function(){
$.ajax({
url: 'http://api.test.com',
method: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: data
})
.done(function(returnObj) {
return returnObj;
})
.fail(function(err) {
console.log(err);
counter++;
if(counter<=3) ajaxFunc();
});
}
ajaxFunc(); // first call
$.ajax({
url: 'http://api.test.com',
method: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: data
tryCount : 1,
retryLimit : 3,
error: function(xhr, textStatus, err){
if (this.tryCount <= this.retryLimit) {
console.log("error")
this.tryCount++;
$.ajax(this);
} else {
console.log("max number ...");
}
}
})
.done(function(returnObj) {
return returnObj;
})
.fail(function(err) {
console.log(err);
});

Call ajax.fail() from ajax.success()

So all I want to do is conditionally call the .fail method from within the .success method, how?
var ajaxCall = $.ajax({
url: pUrl,
type: "POST",
data: pData,
dataType: "json",
processData: false,
contentType: "application/json; charset=utf-8"
})
.always(function () {
alert("always");
})
.success(function (data) {
if (data == "fail") { ajaxCall.fail(); return; }
alert("success");
})
.fail(function () {
alert("fail");
});
$.ajax return a promise so you can't do it directly. Your best shot is that :
var fail = function () {
alert("fail");
};
var ajaxCall = $.ajax({
url: pUrl,
type: "POST",
data: pData,
dataType: "json",
processData: false,
contentType: "application/json; charset=utf-8"
})
.always(function () {
alert("always");
})
.success(function (data) {
if (data == "fail") { fail(); return; }
alert("success");
})
.fail(fail);
You can simply call as this.fail(); as shown below :-
var ajaxCall = $.ajax({
url: pUrl,
type: "POST",
data: pData,
dataType: "json",
processData: false,
contentType: "application/json; charset=utf-8"
})
.always(function () {
alert("always");
})
.success(function (data) {
if (data == "fail")
{
this.fail();
return;
}
alert("success");
})
.fail(function () {
alert("fail");
});
For more information :-
http://www.youlikeprogramming.com/2013/07/jqueryajax-conditionally-call-error-method-fro-success/
just use the "this" keyword to actually call any other method of the ajax call, I have made a sample for error method.
$.ajax({
url: 'url',
dataType: 'json',
contentType: 'application/json; charset=utf-8;',
type: 'GET',
success: function (dataReturn) {
this.error('error called explicitly');
},
error: function (errorMessage) {
if(errorMessage.ResponseText) // or directly compare as errorMessage !== "error called explicitly" if u send the same message elsewhere
//actual error code
else
alert(errorMessage);
}
});
hope this helps :)

Categories

Resources