Update PHP variable with Jquery using AJAX request

1

I have a problem related to HTML, Jquery and PHP, I will try to get as much information as possible. I have a PHP page that has to go back and forth with the variables and it's kind of a step by step, where each step sends its data to the next to filter the tables in the MySQL database. My problem is that the variable goes but not back. So I'm including in the project AJAX requests, where as I click the button I send to the same page via POST in the JQuery values. The problem is that the variable is not taking this value. Would I have to set this variable after the click on the button, or pass this value in another way? I'll send the codes.

console.log($("#prox1"));


$("#prox1").click(function(event) {
console.log("Ok");
console.log($("#curso").val());
console.log($("#turno").val());
console.log($("input[name='tipoLab']:checked").val());
  var dados1 = {curso: $("#curso").val(), turno: $("#turno").val(), tipoLab: $("input[name='tipoLab']:checked").val()};

  $.post('../processamento/index.php', dados1, function() {
    console.log("Fui e voltei");
  });
});
<div class="ls-steps-content" id="step1">
            <?php $sql ="SELECT cursos from cursos order by cursos asc";
            $resultado = conecta( $maquina , $usuario, $senha, $banco, $sql );?>
            <div class="ls-custom-select selectEtapa1">
              <select id="curso" name="curso" class="ls-select">
                <option selected="selected" disabled="disabled"> Cursos </option>
                <?php while ($row = mysql_fetch_assoc($resultado)) {
                  $curso = $row["cursos"];
                  ?>
                  <option value="<?=$curso?>"><?=$curso?></option>
                  <?php } ?>
                </select>
              </div>
              <div class="ls-custom-select selectEtapa1">
                <select id="turno" name="turno" class="ls-select">
                  <option selected="selected" disabled="disabled"> Turno </option>
                  <option value="Manha"> Manhã </option>
                  <option value="noite"> Noite </option>

                </select>
              </div>
              <fieldset>
                <!-- Exemplo com Radio button -->
                <div class="ls-label col-md-5">
                  <p>Escolha uma das plataformas:</p>
                  <label class="ls-label-text">
                    <input type="radio" name="tipoLab" value="labinfo">
                    Laboratório de informática
                  </label>
                  <label class="ls-label-text">
                    <input type="radio" name="tipoLab" value="labEng">
                    Laboratorio de Engenharia
                  </label>
                  <label class="ls-label-text">
                    <input type="radio" name="tipoLab" value="labSau">
                    Laboratório de Saúde
                  </label>
                </div>
              </fieldset>
              <div class="ls-actions-btn">
                <form method="post" action="index.php">
                  <input type="hidden" name="curso">
                  <button type="submit" id="prox1" href="#" class="ls-btn-primary ls-float-right" data-action="next">Próximo</button>
                </form>
              </div>
            </div>
            <div class="ls-steps-content" id="step2">
              <?php $_POST["curso"] ?>
              <div class="ls-actions-btn">
                <a href="#" class="ls-btn" data-action="prev">Anterior</a>
                <a href="#" class="ls-btn-primary ls-float-right" data-action="next">Próximo</a>
              </div>
            </div>

If someone has another way of helping me, it can be too, I just need to keep going back and forth with those variables when the user wants.

Thank you in advance

    
asked by anonymous 12.05.2018 / 05:46

1 answer

1

I'll try to be brief with the answer. I see some errors that are preventing the correct operation:

  • The page is being updated when ordering AJAX. To avoid this in the event handler click() function, add the code event.preventDefault() , because the click event is being triggered by a submit button a form.
  • If you are getting a JSON response, you need to include "post" as the fourth function parameter post()
  • About " O meu problema é que a variável vai mas não volta. ", just to be clear if this is your question too: the variable does not return. What will return is a new value (which can be equal to the one sent) sent by the page invoked - in the ../processamento/index.php case. But it does not make much sense to return the same value since you already have this value in jQuery. It is faster to just return a successful message.
  • I do not know if I understand correctly, but of "onde ao eu clicar no botão eu mando para a mesma página via POST" I understand that you are sending the request to the same page of the form. If this is correct, what will be returned by the server will be the same HTML page that makes the request (without any changes made by the user). But if you want to return only "simple" data, you can return that data in JSON by PHP - or in some other way.

I think it's always good to convert data with JSON.stringfy(meusDados) before sending it to the server, because PHP has some restrictions when working with JSON. To quote a couple of PHP documentation :

  • Names and values string must be enclosed in double quotation marks. Ex: '{"nome": "valor", "idade": 32}'
  • Can not have comma after the last item. Ex: '{"vouDarErro":"vírgulaSobrando",}'

I hope I have helped. If you are confused, comment below.

    
12.05.2018 / 12:07