1

Olá! Estou usando um ajax em um botão para que quando clico nele este submeta um form, o botão então muda de VALIDAR para VALIDADO, tudo isso sem recarregar a página.

Eis o código:

$('#validar_form').submit(function(event){
  $.ajax({
    url: 'valida_horaextrarh.php',
    type: 'post',
    dataType:'html',
  data: $('#validar_form').serialize(),
  success: function(response, textStatus, jqXHR){
    $('#principal').html(response);
  },
  error: function(jqXHR, textStatus, errorThrown){
    console.log('error(s):'+textStatus, errorThrown);
  }
 });
});

O problema é que o código atual só permite que eu clique nos botões na ordem que são exibidos, imagem abaixo: inserir a descrição da imagem aqui

Caso eu tente validar a solicitação da Pessoa 3, eu preciso validar primeiro a Pessoa 2, pois caso contrário o botão não executa o ajax.

Como resolver isso para que eu possa clicar nos botões em qualquer ordem?

4
  • Cada linha dessa está dentro de um form ? Commented 26/04/2018 às 14:41
  • Tem um select coletando as linhas no banco, um foreach que tabela elas pra mim enquanto houver dados, cada linha gera esse botão que submete um form pra dar update na linha dizendo que ela foi conferida, o submeter desse form usa o ajax pra não atualizar a página e processar os dados. Commented 26/04/2018 às 14:52
  • Pergunto o mesmo que o @LeandroLima... cada linha tem um form próprio ou todo o bloco está dentro de um form? Coloque o código que seja possível de executar/testar senão vai ser difícil ajudar.
    – Fernando
    Commented 26/04/2018 às 14:56
  • Cada linha tem um form, inclusive entendi o porque da pergunta, como ele procura pelo ID do form o problema deve ser esse, o ajax para no primeiro ID que encontra, mas como resolver não sei. Commented 26/04/2018 às 15:17

1 Resposta 1

1

Esse código abaixo não é a melhor forma de fazer isso acredito eu. Mas eu não sei qual seria a forma mais elegante de fazer.

Cria os forms com o foreach:

<?php foreach ($linhas as $linha): ?>
    //Cria o form aqui. Observe o ID.
    <form id="#validar_form<?=$linha['id']?>">
        <button onclick=ajax(<?=$linha['id']?>)>Validar</button>
    </form>
<?php endforeach ?>

Observe que eu concatenei uma chave única que tá vindo do banco dentro do id do html. E adicionei uma função chamada ajax dentro do botão.

Faz a requisição via ajax:

function ajax(id) {
$.ajax({
        url: 'valida_horaextrarh.php',
        type: 'post',
        dataType:'html',
        data: $('#validar_form'+id).serialize(),
        success: function(response, textStatus, jqXHR){
            $('#principal').html(response);
        },
        error: function(jqXHR, textStatus, errorThrown){
            console.log('error(s):'+textStatus, errorThrown);
        }
    });
}

Observe que a informação que é serializada pelo ajax é um form com id único agora.

1
  • 1
    Se é ou não a forma mais elegante não sei, MAS FUNCIONA! Muito obrigado! Commented 26/04/2018 às 18: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 .