0
votes

Comment faire en sorte que le site Web attende que mon fichier ajax renvoie une valeur au lieu d'imprimer undefined?

J'ai donc cette fonction et je veux que le programme attende qu'il renvoie une valeur au lieu de donner une valeur indéfinie.

  document.getElementById('demo').innerHTML = 'test' + savedNumberOfLessonInDay(number);

<?php

require '../notWebsite/dbh.php';
session_start();
$dayID = (int)$_GET['GETDayID'];

$sqlCount = "SELECT COUNT(lessonID) FROM daylesson WHERE dayID = ?";
  $stmt = mysqli_stmt_init($conn);

  if(!mysqli_stmt_prepare($stmt, $sqlCount)) {
   header("Location: ../GymnasieArbeteHemsida.php?error=countError");
    exit();
  }
  else {
 mysqli_stmt_bind_param($stmt, "i", $dayID);//Puts in variable in question
   mysqli_stmt_execute($stmt);//Executes the question
mysqli_stmt_bind_result($stmt, $result);//Binds the reuslt of the question to the variable $result
if(mysqli_stmt_fetch($stmt)){//If the result of the question can be recieved
  echo $result;//Send the result to the website
}


        exit();
  }

  mysqli_stmt_close($stmt);
  mysqli_close($conn);



 ?>

function savedNumberOfLessonInDay(dayID){
     var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
          if (this.readyState == 4 && this.status == 200) {
            document.getElementById('demo4').innerHTML = this.responseText; //Returns the right number
            return this.responseText;
        }
      };
      var PageToSendTo = "AJAX/countLessonInDay.php?";
    var MyVariable = dayID;
    var VariablePlaceholder = "GETDayID=";
    var UrlToSend = PageToSendTo + VariablePlaceholder + MyVariable;
      xhttp.open("GET", UrlToSend, false);
      xhttp.send();
   }

Ce code renvoie test non défini à demo mais 16 (qui est le nombre que je cherche) à demo4. Comment puis-je faire en sorte qu'il renvoie test16 en démo au lieu de testundefined?

php javascript ajax

0 commentaires

3 Réponses :

0
votes

Vous ne pouvez pas appeler savedNumberOfLessonInDay (number) pour obtenir le numéro. Vous essayez de le faire en utilisant return this.responseText; , mais cela ne se déclenchera que lorsque la requête au serveur sera terminée.

Vous pouvez utiliser Promises pour résoudre ce problème.

  savedNumberOfLessonInDay(number).then((response) => {
      document.getElementById('demo').innerHTML = 'test' + response;
  });

Et utilisez await pour l'appeler:

  document.getElementById('demo').innerHTML = 'test' + await savedNumberOfLessonInDay(number);

Ou, si pour une raison quelconque vous ne pouvez pas utilisez await:

function savedNumberOfLessonInDay(dayID){
     return new Promise((resolve) => {
     var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
          if (this.readyState == 4 && this.status == 200) {
            document.getElementById('demo4').innerHTML = this.responseText; //Returns the right number
            resolve(this.responseText);
        }
      };
      var PageToSendTo = "AJAX/countLessonInDay.php?";
    var MyVariable = dayID;
    var VariablePlaceholder = "GETDayID=";
    var UrlToSend = PageToSendTo + VariablePlaceholder + MyVariable;
      xhttp.open("GET", UrlToSend, false);
      xhttp.send();
     });
   }

0 commentaires

0
votes

La fonction savedNumberOfLessonInDay () n'attendra pas la fin de l'ajax. Vous devez donc définir le code HTML pour la démonstration dans la fonction de rappel xhttp.onreadystatechange.

Sans trop changer votre implémentation, vous pouvez simplement modifier votre code:

savedNumberOfLessonInDay(number);

}

Et puis appelez simplement la fonction au lieu de essayer de définir le

function savedNumberOfLessonInDay(dayID){
 var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        document.getElementById('demo4').innerHTML = this.responseText; //Returns the right number
        document.getElementById('demo').innerHTML = 'test' + this.responseText;
    }
  };
  var PageToSendTo = "AJAX/countLessonInDay.php?";
var MyVariable = dayID;
var VariablePlaceholder = "GETDayID=";
var UrlToSend = PageToSendTo + VariablePlaceholder + MyVariable;
  xhttp.open("GET", UrlToSend, false);
  xhttp.send();

0 commentaires

0
votes

essayez d'utiliser async / await voici comment l'utiliser. https://javascript.info/async-await

1 commentaires

Veuillez n'utiliser les liens qu'à titre de référence.