0

Eu estou querendo fazer um post sem refresh, onde o mesmo abre um modal de confirmação.

Porém ele esta reatualizando o site quando o post é submetido e quando colocado o e.preventDefault(); o post não envia, pois no modal de confirmação não carrega os dados.

<form id="addEvent" method="post" action="">
      <h2>Data</h2>
      <input type="date" name="date" id="date" >
               <div class='col-sm-4'>
                </div>
      <h2>Observações</h2>
      <textarea placeholder="Observações" name="notes" cols="30" rows="10"></textarea>
      <h2>Matéria</h2>
      <select name="tags" id="mat" >
          <?php 

          $add = new USER();

                      $stmt = $add->runQuery("SELECT * FROM materias ORDER BY id_mat");
        $stmt->execute();
        $m=$stmt->fetchAll(PDO::FETCH_ASSOC);
        foreach($m as $mat) {
          $materia = $mat['materia'];
          ?>
            <option  value="<?php echo $materia;?>"><?php echo $materia;?></option>   
            <?php }?>
        </select>
        <br>
        <br>
        <input type="submit" class="o-btn js-event__save md-trigger md-setperspective" data-modal="modal-18"  id="dataform" name="dataform" value="AGENDAR">
    </form>

   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
       $("#dataform").click(function(){
       $.ajax({
           dataType:'html',
           url:"ag-monitoria.php",
           type:"POST",
           data:$(this).serialize(),

           beforeSend: function(data){ 

            }, success:function(data){
                alert("Dados Enviados");
            }, complete: function(data){}


           });


            });
    </script>

1 Resposta 1

3

Você está a utilizar o evento errado para fazer o pedido.
Em vez utilizar o onclick deveria utilizar onsubmit.

O evento onsubmit é chamado a partir do momento que você fizer a submissão do formulário através do clique do rato.

$(()=>{
    $('#myForm').on('submit', (e)=>{
        $.ajax({
            dataType:'html',
            url:"ag-monitoria.php",
            type:"POST",
            data:$(this).serialize(),

            beforeSend: function(data){ 

            }, success:function(data){
                alert("Dados Enviados");
            }, complete: function(data){}
        });

        e.preventDefault();

    });
});

Referências::

Documentação sobre onsubmit

(e)=>{} equivale a function(e){ }

Artigo sobre Arrow Functions

1
  • Ele para o refresh, porém ainda sim as variáveis não passam, voltam nulas e por exemplo quando o form é submetido ele executa uma função do PDO, onde essa função registra no banco de dados as variáveis e toda vez que o form é submetido a tabela do banco não é alterada. OBS : No código anterior sem o e.preventDefault(); ele registra no banco. Commented 14/09/2018 às 22:28

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .