html - Get the same result again if the same data is entered in Ajax and PHP

in my code, a number is entered in a <textarea> that is sent by AJAX to validate it randomly with PHP (using rand()) and then I return the same number to a <div> in HTML plus the word correct or incorrect as the case may be.

The problem is that if I type the same number in the <textarea> and send it, it obviously returns a different value than the first one.

I would like to make that only in that session or (unless the user refreshes the tab) the value is the same even if I send it many times. For example if I send 12345678, if the first time the algorithm gives me "correct" then it stays the rest of the times the user makes the request.

Could you help me? I am just starting to try things with AJAX, I don't know much about PHP. I am just learning.

I attach parts of my code. Jquery:

updateTextBox(prueba[revisar]);
  ajaxCall = $.ajax({
    url: "miarchivo.php",
    dataType: "json",
    cache: false,
    type: "POST",
    beforeSend: function (nautia) {
      $("#checar").html("<img src='loading.gif'/>");
    },
    data: "ajax=1&do=check&lista=" + encodeURIComponent(prueba[revisar]),
    success: function (datos) {
      switch (datos.enviar) {
        case 0:
          revisar++;
          $("#div1").append(datos.largo + "<br />");
          updateProgress(revisar, prueba.length);
          erroneos();
          break;

        case 1:
          revisar++;
          $("#div2").append(datos.num2 + "<br />");
          updateProgress(revisar, prueba.length);
          erroneos();
          break;

        case 2:
          revisar++;
          $("#div3").append(datos.num3 + "<br />");
          nieva++;
          updateProgress(revisar, prueba.length);
          corectos();
          break;
      }

Part of my PHP Code:

<?php
$numPrincipal = $_POST["lista"] . "|";
$numPrincipal = str_replace("Numero", "", $numPrincipal);
$numPrincipal = str_replace("NUMERO", "", $numPrincipal);
if ($numPrincipal == 0) {
    header("location: /");
    return false;
}
$numPrincipal = str_replace(" ", "", $numPrincipal);
$quitarSimb = str_replace("|", "", $numPrincipal);
$largo = strlen($quitarSimb);
$empiezaCon = substr($quitarSimb, 0, 1);
if ($empiezaCon == 1) {
    if ($largo === 10) {
        $num = substr($quitarSimb, 0, 10);
    }
    if ($largo < 10 || $largo > 15) {
        echo '{"enviar":0,"largo":"<span class=text-danger>Est?? muy largo</span>' . $numPrincipal . '"}';
        return false;
    }
}
$randomNmr = rand(0, 7);
if ($randomNmr == 1) {
    echo '{"enviar":1,"num2":"<span class=text-danger>erroneo</span>' . $numPrincipal . '"}';
    return false;
}
if ($randomNmr == 2) {
    echo '{"enviar":2,"num3":"<span class=text-primary>correcto</span>' . $numPrincipal . '"}';
    return false;
}

?>

Answer

Solution:

Use an object to hold the values returned by the AJAX call for each value of prueba[revisar]. Then you can check if the saved value is saved, and not make the AJAX call.

I've split the code that displays the result of the AJAX call out to a separate function, so it can be called either in the success: function or directly.

function display_datos(prueba, datos) {
  switch (datos.enviar) {
    case 0:
      revisar++;
      $("#div1").append(datos.largo + "<br />");
      updateProgress(revisar, prueba.length);
      erroneos();
      break;

    case 1:
      revisar++;
      $("#div2").append(datos.num2 + "<br />");
      updateProgress(revisar, prueba.length);
      erroneos();
      break;

    case 2:
      revisar++;
      $("#div3").append(datos.num3 + "<br />");
      nieva++;
      updateProgress(revisar, prueba.length);
      corectos();
      break;
  }
}

var saved_datos = {};

if (saved_datos[prueba[revisar]]) {
  display_datos(prueba, saved_datos[prueba[revisar]]);
} else {
  ajaxCall = $.ajax({
    url: "miarchivo.php",
    dataType: "json",
    cache: false,
    type: "POST",
    beforeSend: function(nautia) {
      $("#checar").html("<img src='loading.gif'/>");
    },
    data: {
      ajax: 1,
      do: 'check',
      lista: prueba[revisar]
    },
    success: function(datos) {
      saved_datos[prueba[revisar]] = datos;
      display_datos(prueba, datos);
    }
  });
}

Answer

Solution:

Store the results of each query in a cache variable. A Map is an excellent option for this.

Before you make a request, check the cache for an existing value.

const cache = new Map();

// example function for handling input
function handleInput(value) {
  if (!cache.has(value)) {
    $.ajax({ /* ... */ }).done(function(datos) {
      cache.set(value, datos);
      handleResponse(datos);
    });
  } else {
    handleResponse(cache.get(value));
  }
}

function handleResponse(datos) {
  // switch(datos.enviar) { ...
}

Source