Home / Questions / 47950
Accepted
Antonio Ángel Estrada Pérez
Asked: 2020-02-07 03:33:36 +0800 CST 2020-02-07 03:33:36 +0800 CST

show array in order

  • 772

By php I have a list of the words, which I want to appear one by one when I press a button by JS. Right now with the code I have I show the words one by one but out of order. What I want to do is show them in an orderly way just as I have them written in the code.

document.addEventListener('DOMContentLoaded', function () {
  var clickTimes = 0;
  var inicialImage = document.getElementById('inicial');
  var loadingImage = document.getElementById('pensando');
    var ideaImage = document.getElementById('idea');
    var finalImage = document.getElementById('final');
  var btnRandomWord = document.getElementById('randomWordGen');
  var wordOutput = document.getElementById('wordOutput');
  var ocultarCarga = document.getElementById('ocultar_mientras_carga');
    
    if(clickTimes == 0){
        ideaImage.classList.remove('visible');
        inicialImage.classList.add('visible');
        ocultarCarga.classList.add('visible');
    }

  btnRandomWord.addEventListener('click', function () {
    if (clickTimes < 3) {
        ocultarCarga.remove('visible'); // elimina la clase CSS 'visible'
        inicialImage.remove('visible'); // elimina la clase CSS 'visible'
        loadingImage.classList.add('visible'); // agrega la clase CSS 'visible'
        ideaImage.classList.remove('visible'); // elimina la clase CSS 'visible'
        btnRandomWord.classList.add('invisible'); //elimina boton generar palabra

      var request = new XMLHttpRequest();
      // método HTTP y URL
      request.open('GET', 'php/randomwordgen.php');
      request.onload = function () {
        // estado 4 = petición completada y respuesta recibida
        if (request.readyState === 4) {
          // código HTTP 200 = petición exitosa
          if (request.status === 200) {
            // se define un timeout de 2.5 segundos (ms)
            window.setTimeout(function () {
                btnRandomWord.classList.remove('invisible'); //muestra el boton generar palabra
                loadingImage.classList.remove('visible');
                ideaImage.classList.add('visible');
                wordOutput.textContent = request.responseText;
                clickTimes++;
            }, 1000);
          }
        }
      };
      request.send(); // se envía la petición
    } else {
        loadingImage.classList.add('visible');
        ideaImage.classList.remove('visible');
            window.setTimeout(function () {
                
                loadingImage.classList.remove('visible');
                 
                wordOutput.textContent = 'MEJOR REGALALE UN MINI';
                finalImage.classList.add('visible'); // añade la clase CSS 'visible'
            }, 1000);
               
               
                btnRandomWord.classList.add('invisible');
    }
  });
});
<?php

$frases = array(
  1 => "MINIPIMER",
  2 => "MINIBAR",
  3 => "MINIFALDA",
);

$numero = rand (1,6);

echo $frases[$numero];

?>
    <div id="final">
        <img src="images/model_new_mini_one.png" alt="final" title="final"/>
       Nuevo mini
    </div>

    <div id="inicial">
        <img src="images/cocinando.gif" alt="inicial" title="inicial"/>
        Click para pensar una idea
    </div>
    
    <div id="idea">
        <img src="images/idea.gif" alt="idea" title="idea"/>
        Tenemos una idea!
    </div>
    
    <div id="pensando">

        <img src="images/hsk.gif" alt="cocinando" title="Cocinando"/>
        <p>Estamos pensado una idea...</p>
    </div>
    
    
    <div class="word">
      <span id="wordOutput"></span>
        <button id="randomWordGen">Generate</button>
    </div>

I am showing an array of numbers through php, right now I show it with the rand function so that they are out of order. How do I make them display in order?

<?php

$frases = array(
  1 => "Una lavadora",
  2 => "Un movil",
  3 => "Una muñeca",
  4 => "Un Pecho",
  5 => "Una caca",
  6 => "JOSEJUAN",
);

$numero = rand (1,6);

echo $frases[$numero];

?>

php

1 Answers

  1. Best Answer

    To solve this problem you should do the following, in the js pass it as a parameter clickTimesas follows:

    request.open('GET', 'php/randomwordgen.php?clickTimes='+clickTimes);

    ye the php do a get on this variable:

    if(isset($_GET['clickTimes'])){
 $numero=$_GET['clickTimes']+1;
   $frases = array(
      1 => "Una lavadora",
      2 => "Un movil",
      3 => "Una muñeca",
      4 => "Un Pecho",
      5 => "Una caca",
      6 => "JOSEJUAN",
    );

   echo $frases[$numero];
}
    • 1