AJAX result OK but no data - javascript

I'm using jQuery to perform following AJAX request:
jQuery.ajax({
url: "url-to-script",
dataType: "html",
async: false,
success: function(data) {
console.log(data);
},
error:function(){
showMessage('Chyba', 'error');
}
});
Script that I'm calling is returning part of HTML. It is working properly.
But when I call this AJAX it will end with blank response in data. When I call it again it will return what it should and each next call is working. But the first one after page load is never working. I've no idea why.
I've also tried
if (data)
// do something
else
try again
But it just freeze my browser. So I don't know what is wrong.
Thanks for ideas!

Related

ajax to an html site is getting 200 but the response is empty

An example:
this is the site I'm trying to get the HTML:
https://stackoverflow.com/questions/2294493/how-to-get-the-position-of-a-character-in-python
and the AJAX call
$.ajax({
url: href,
type: "get", //send it through get method
success: function(response) {
var htmlElem = $($.parseHTML(response));
console.log({response})
},
error: function(xhr) {
//Do Something to handle error
}
})
the response is empty ("") all the time, can someone know why? and how to fix it?
EDIT:
Loading cross-domain endpoint with jQuery AJAX
this is not fixinig the issue

Ajax call does not work at first, but successful call afterwards

I'm working on Cordova hybrid mobile app. I'm calling an API to load data into my variables and process it. Below is the problem.
First, I call the API using ajax. After ajax call, I check if jsonString is empty and if it is, I reload the page to run the ajax call again.
$.ajax({
url: GetConfigUrl // working URL,
type: 'POST',
data: {
token: '123456'
},
cache: false,
datatype: 'json',
contenttype: "application/json",
success: function (data, response, xhr) {
debugger
jsonString = data.Value;
},
error: function (data) {
// do nothing
)
});
if (jsonString == '') {
// Display popup to ask user the reload the page
}
return true;
I have a debugger in place in the success call function, but it does not hit and directly go to check if jsonString is empty, which is empty because it does not call the ajax to load data and proceed to display popup to ask user to reload the page.
After hitting the page reload, the debugger in the success call is being hit and able to retrieve the value. Thus the jsonString is not empty and able to proceed.
I check the Network tab in the console, it shows the below result:
It seems that the first call was made but always remain pending. The second call is the success one and return the correct value. So the jsonString checking is passed.
This issue happen all the time where the first ajax call is not success and in pending but all subsequent calls are successful.
So what could be wrong here? How do I ensure that the first ajax call will be made successfully and return the data all the time?
Ajax is executed asynchronous place your logic in the success function for it to get executed when the ajax call completes
$.ajax({
url: GetConfigUrl // working URL,
type: 'POST',
data: {
token: '123456'
},
cache: false,
datatype: 'json',
contenttype: "application/json",
success: function (data, response, xhr) {
debugger
jsonString = data.Value;
if (jsonString == '') {
// Display popup to ask user the reload the page
}
},
error: function (data) {
// do nothing
)
});
return true;

Timeout not working in ajax post request

I am not able to make ajax error callback function of after 3 seconds. I tried with timeout, but it will not switch to error callback after specified time! I am not able to get the alert Got timeout.
When I referred similar questions in this site with similar problems it didn't helped out. They all use ajax GET type. I am using jquery 1.10.1 library.
script :
$.ajax({
type: 'POST',
timeout: 3000,
url : "http://mydomain/Services.asmx/Best_Scores",
dataType: "text",
async:false,
crossDomain:true,
data: "strJsonRequest="+scoredata,
success: function (data) {
// Success code ...
},
error: function (data, textStatus, errorThrown) {
if(textStatus == "timeout") {
alert("Got timeout");
}
}
});
Any solution ?
Fix :
Change async : false to async: true
Reason :
A synchronous AJAX call blocks until the request has been finished. Implementing a timeout is not possible for technical reasons, because the AJAX call would have to be executed later.
If an AJAX call is executed later, the function somehow has to implement a blocking feature, to stop the code from running further after the AJAX call, and execute it again after a timeout - not possible.
Today, (in 2019) I still have this problem.
I have an ajax call too long (depending from Date Start-> Date End) php script.
and after some minutes I get error 500, async: true don't help.
The call is:
$.ajax({
type: "GET",
dataType: 'json',
url: 'mymscript.php',
contentType:'application/json;charset=UTF-8;',
data: $('[name="myForm"]').serialize(),
async:true,
timeout:0,
success: function(response){
...
I resolved using:
side PHP:
set_time_limit(0);
ignore_user_abort(true);
at begin of script.
echo ' ';
flush();
ob_flush();
in the middle of script (for example in main loop every day). This help to let client to don't disconnect (I think that is the main problem).
Using this I continuosly write spaces befor the final json.
Fortunately jquery trim spaces before to parse the json and, in the end, the json is valid.
So I can catch response object to know if script is ended with errors or warnings.
I Hope this help somebody.

ajax function not fetching url

I have:
function makeAjaxRequest() {
var url = '/queryjob/dbname/ip';
$.ajax(url,
{
success: alert(response)
});
}
When I do a normal browser request on this url I get a response of 43(just a test response right now)
When I click the button I have to run this function, nothing happens. I don't see a get request in the log at all. Do I have some stupid syntax error or something? I am pretty new to js and ajax. I have another function that works where I get a url and act on the html response code, but this one is killing me so far.
You are not calling $.ajax correctly. Assuming you wanted to make a GET request, this is the correct syntax:
$.ajax({
type: 'GET',
url: url,
success: function(response) {
alert(response);
}
});
You could also use $.get to accomplish the same thing:
$.get(url, function(response){
alert(response);
});
$.ajax({
type: "GET",
url: "/queryjob/dbname/ip",
success: function (data) {
alert(data);
}
});
Yes, it was a syntax error ;)

Nested AJAX Functions - 500 Internal Error

I'm trying to run a script and then if there's success, I want to run another script. I'm doing this through jQuery and AJAX. I've tried both scripts individually and they both work by themselves (the AJAX functions). Here is the code:
$.ajax({
url: '/v/vspfiles/inventory-update/automation.asp',
success:function(data){
if(data=="True"){
$.ajax({
type: 'GET',
data:"filename=inventory.csv",
url: '/v/vspfiles/inventory-update/createxml.asp',
success:function(data){
alert('it worked');
}
});
}
}
});
I get a 500 internal error on the /v/vspfiles/inventory-update/createxml.asp?filename=inventory.csv when I run the code this way. I don't know why since the code works when I visit the page directly and when I run the AJAX by itself but when it's nested I get a 500 error.
Any idea why that would be happening? Thanks for your help!
There's nothing wrong with your code; nesting of ajax calls is allowed. Your server may be configured improperly. You can try to delay the second ajax call to see if that make any difference.
$.ajax({
url: '/v/vspfiles/inventory-update/automation.asp',
success:function(data){
if(data=="True"){
setTimeout( function() {
$.ajax({
type: 'GET',
data:"filename=inventory.csv",
url: '/v/vspfiles/inventory-update/createxml.asp',
success:function(data2){
alert('it worked');
}
});
},5000 );
}
}
});
5 seconds may be too long but it should prove to you that nesting ajax calls is quite proper and may point to what configuration changes may be required on the server. Give it a try. After all, that's what troubleshooting is all about.

Categories

Resources