How can I increment a variable within ejs.file

Question

I'm creating a quiz where the user will access one question at a time. After clicking Submit, it adds +1 to the counter and advances to the next question in the array. All of my questions are stored within my database in MongoDB.

What I've tried:

<% var pos = 0 %>

  <section class="nivelamento" id="nivelamento">
      <div class="container">

          <h2 id='teste_status' class="nivelamento-titulo">Math Questions!</h2>
          <h6>Question <%= (pos + 1) %> of <%= quizzes.length %> </h6>
          <div id="teste">

              <form action="/nivelamento" method="POST">
                  <h2><%= quizzes[pos].question %></h2>
                  <input type="radio" name='options' value="A"><%= quizzes[pos].firstOption %><br>
                  <input type="radio" name='options' value="B"><%= quizzes[pos].secondOption %><br>
                  <input type="radio" name='options' value="C"><%= quizzes[pos].thirdOption %><br><br>
                  <button type="submit" class="btn btn-danger btn-sm">Submit Answer</button>
              </form>

                  <% if(opcaoEscolhida === quizzes[pos].rightAnswer){ %>
                      <% correct++ %>                
                  <% }  %>

                  <% pos++ %>

          </div>    
      </div>
  </section>

After I click submit, everything remains the same, the position number of my array does not change.

For the rest, so far, everything seems to work fine, because manually changing my counter I have the desired result.

Answer 1

You cant do it. once the page loaded the ejs transform to regular html. you need to use javascript for this kind of things. its like echo in php you can read about the idea. you will need to create a variable in java script and put it in divs and headlines in the html