I tried to use ajax requests and response async, but it seems not to work. I'm sending every second ajax request. The console should print out "DON'T WAIT" every second and "WAIT5" every 5 Seconds (sleep in php). But what happens is, that "DON'T WAIT" get logged, then the whole site/script waits 5 Seconds and both messages are logged 5 times. How can I make this async, so "DON'T WAIT" es really every second and doesn't wait for the other script ?

//Edit: This is an example. The idea is later to Execute a code ( not setInterval ) which need 10 seconds to get the done-status. In this time the other setInterval should work as normal and not waiting ! The sleep as sleep(rand(5,10));

Javascript:

function getProductionStatus() {
  jQuery.ajax({
      url: "report.sessioncall.php",
      dataType: "json",
      async: true
  })
  .done(function(data) {
      console.log(data);
  });
}
function getProductionStatusLong() {
  jQuery.ajax({
      url: "report.sessioncall1.php",
      dataType: "json",
      async: true
  })
  .done(function(data) {
      console.log(data);
  });
}
window.setInterval(getProductionStatus, 1000);
window.setInterval(getProductionStatusLong, 1000);

PHP:

<?php
session_start();
sleep(5);
$_SESSION["jobs"] = "WAIT5";
$sessionstatus = json_encode($_SESSION["jobs"]);
echo $sessionstatus ;
?>

AND

<?php
session_start();
$_SESSION["jobs"] = "DONT WAIT";
$sessionstatus = json_encode($_SESSION["jobs"]);
echo $sessionstatus ;
?>

I tried to use ajax requests and response async, but it seems not to work. I'm sending every second ajax request. The console should print out "DON'T WAIT" every second and "WAIT5" every 5 Seconds (sleep in php). But what happens is, that "DON'T WAIT" get logged, then the whole site/script waits 5 Seconds and both messages are logged 5 times. How can I make this async, so "DON'T WAIT" es really every second and doesn't wait for the other script ?

//Edit: This is an example. The idea is later to Execute a code ( not setInterval ) which need 10 seconds to get the done-status. In this time the other setInterval should work as normal and not waiting ! The sleep as sleep(rand(5,10));

Javascript:

function getProductionStatus() {
  jQuery.ajax({
      url: "report.sessioncall.php",
      dataType: "json",
      async: true
  })
  .done(function(data) {
      console.log(data);
  });
}
function getProductionStatusLong() {
  jQuery.ajax({
      url: "report.sessioncall1.php",
      dataType: "json",
      async: true
  })
  .done(function(data) {
      console.log(data);
  });
}
window.setInterval(getProductionStatus, 1000);
window.setInterval(getProductionStatusLong, 1000);

PHP:

<?php
session_start();
sleep(5);
$_SESSION["jobs"] = "WAIT5";
$sessionstatus = json_encode($_SESSION["jobs"]);
echo $sessionstatus ;
?>

AND

<?php
session_start();
$_SESSION["jobs"] = "DONT WAIT";
$sessionstatus = json_encode($_SESSION["jobs"]);
echo $sessionstatus ;
?>

• javascript
• php
• jquery
• ajax
• asynchronous

• Ajax itself is Asynchronous java and XML itself. no need to write asynch ajax. – Vinayak Pingale Commented Jan 16, 2014 at 12:38
• Just remove the sleep, and set the interval to 5000 instead, as what you're doing doesn't make much sense – adeneo Commented Jan 16, 2014 at 12:38
• The sleep is not an final time, this should later be something like a big MYSQL-request which needs time – abcNocturn Commented Jan 16, 2014 at 12:52

2 Answers 2

The rule

Ajax requests are asynchronous by default. If you don't change this by using $.ajaxSetup({async:false}), there is no need to write async: true in your ajax request.

The reason for this is, that in the most cases, it's bad practice to make synchronous ajax request, because you can worsen your user experience by preventing your browser to react on user input.

Your specific solution

Just change

window.setInterval(getProductionStatusLong, 1000);

to

window.setInterval(getProductionStatusLong, 5000);

I would not trust this to work.

Instead try something like this - it will not run exactly on the second, nothing will, but it may be closer to what you want

var cnt = 0
function getProductionStatus() {
  $.ajax({
      url: "report.sessioncall.php",
      dataType: "json"
  })
  .done(function(data) {
      console.log(data);
      cnt++
      if (cnt==5) {
        getProductionStatusLong()
        cnt=0;
      }
      else  {
        setTimeout(getProductionStatus, 1000); 
      }  

  });
}
function getProductionStatusLong() {
  $.ajax({
      url: "report.sessioncall1.php",
      dataType: "json"
  })
  .done(function(data) {
      console.log(data);
      getProductionStatus();
  });
}
$(function() {getProductionStatus()});