Sistema de perguntas com Ajax

16/09/2022

Boa tarde, estou tentando desenvolver um sistema de quest�es com Jquery Ajax. Deu tudo certinho, utilizando POST (pois vou colocar pelo PHP). No entanto, ele s� funciona no primeiro formul�rio.
A p�gina inicial retorna as quest�es do banco de dados por um loop while com PHP, quando eu clico em responder ele troca o par�grafo que est� abaixo do bot�o submit para a resposta que o usu�rio botou, por�m s� funciona com a primeira quest�o, o resto quando clico em responder a pagina atualiza e nada acontece. Se algu�m puder me ajudar, preciso muito disso.

index.php

<?php
    // INCLUI A CONFIGURA��O DO PAGAMENTO
    include("php/connect.php");
?>
<!doctype html>
<html lang="pt-BR">
    <head>
        <!-- required meta tags -->
        <meta charset="utf-8">
        <title>Pagamento</title>
    </head>

    <body>

    <?php

        // LOOP COM As PERGUNTAS 
        $query = $conn->prepare("SELECT * FROM questoes");
        $query->execute();

        while($row = $query->fetch(PDO::FETCH_ASSOC)){
    ?>
    <form action="" method="POST" id="questao">
        <p><?php echo $row[''''pergunta'''']; ?></p>

        <br>
        <input type="hidden" id=''''id'''' value="<?php echo $row[''''id'''']; ?>">
        <input type="radio" name="opcao" id="opcao" value="a"/><?php echo $row[''''opcao_a'''']; ?><br>
        <input type="radio" name="opcao" id="opcao" value="b"/> <?php echo $row[''''opcao_b'''']; ?><br>
        <input type="radio" name="opcao" id="opcao" value="c"/><?php echo $row[''''opcao_c'''']; ?><br>
        <input type="radio" name="opcao" id="opcao" value="d"/><?php echo $row[''''opcao_d'''']; ?><br>
        <input type="radio" name="opcao" id="opcao" value="e"/><?php echo $row[''''opcao_e'''']; ?><br>
        <br><br>

        <input type="submit" id="submit" value="responder"> <p id="resposta_user">aaa</p>
    </form>

    <?php } ?>

    <!-- JQUERY -->
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

    <script>
    $(document).ready(function(){
        $("#submit").click(function(event){
            event.preventDefault();
            var opcao = $("input[name=''''opcao'''']:checked").val();
            var id = $("#id").val();

            $.ajax({
                url: ''''php/responder.php'''',
                method: ''''POST'''',
                data: {opcao: opcao, id: id}
            }).fail(function(){
                alert(''''erro'''');
            }).done(function(result){
                var id = $("#resposta_user").html(result);
            });
        });
    });
    </script>
    
    </body>
</html>

responder.php

<?php
    $id = $_POST[''''id''''];
    $resposta = $_POST[''''opcao''''];
    
    echo "ID DA QUEST�O " . $id;
    echo "RESPOSTA DO USU�RIO " . $resposta;
?>

Jo�o Lucas

Curtir t�pico + 0

Responder