1

For a school project, we try to code a Wordle type game.

We are implementing an incremental mode where the user starts with a 3 letters long words and then have a 4's one in case of success etc ...

The fact is, we have problems from the 3 letters long game to go to the 4 letters long one.

From the front, Ajax is used to ask the server to res.render another page but the render isn't done. The page isn't reloaded, and we stay also on a "you won" page.

How could I force the reloading of the current page or render the same page but with the parameter of the current word length incremented ?

The part form the front used :

$("input").on("keydown", function (event) {
      if (event.key == 'Enter' && this.checkValidity()) {
      let mot_entre = this.value;
      entrerUnMot(mot_entre);
      this.value = '';

      if (mot_entre == app.mot) {
          $("input").remove();
          $("#victory").text("Bravo, vous avez gagné!");
          if (<%= id_joueur %> != 0) {
          sauvegarderScore("<%= mode %>", <%= nb_lettres %>, <%= id_joueur %>);
          }
          app.partie_gagnee = true;
          if ("<%= mode %>" == "incremental" && parseInt(<%= nb_lettres %>) < INCREMENTAL_LETTRES_MAX) {
          incrementerPartie(<%= nb_lettres %>, <%= id_joueur %>);
          }
      }
      }
  });

Ajax request :

function incrementerPartie(nb_lettres, id_joueur) {
      $.ajax({
      type: 'POST',
      url: '/jouer/incrementalNextGame',
      data: {nb_lettres: nb_lettres, id_joueur: id_joueur},
      success: function() {
      },
      error: function() {
          alert("impossible de lancer la partie suivante du mode incrémental");
      }
      });
  }

Here is the back-end code used :

router.use('/incrementalNextGame', (req, res, next) => {
res.render('jouer.ejs', {mode: "incremental", nb_lettres: parseInt(req.body.nb_lettres) + 1, id_joueur: req.body.id_joueur});});
Lucas Martin
  • 13
  • 4
  • Your `$.ajax` request fetches the HTML page constructed by `res.render` but does nothing with it (`success: function() {}`). Such a server-side-rendered page must not be fetched with `$.ajax`, but the browser must _navigate_ to it, in your case by submitting an HTML `
    ` with `` and ``.
     – Heiko Theißen Jan 02 '23 at 16:53
  • So if I understand well, you say that, in my case, put anything in the ajax' success function will not change my results ? And I don't really want to "navigate", because I don't change of page, it's exactly the same but with different parameters. – Lucas Martin Jan 02 '23 at 17:01
  • To change only parts of the page, don't use `res.render`, but change the document with Javascript. – Heiko Theißen Jan 02 '23 at 17:41

0 Answers0