0
votes

comment créer un formulaire mis à jour automatiquement avec php et jquery?

J'essaye de faire une mise à jour de la sélection en sélectionnant l'élément sur un autre formulaire sans que la page ne se rafraîchisse J'ai suivi un tutoriel ( https://www.youtube.com/watch?v=AofECml9pQU ) et accédez à ceci (cela fait partie de mon code)

 <?php
include('../connexion.inc.php');
?>
<?php
$test = 0;
if (isset($_POST['jeu'])) {
    $jeu  = $_POST['jeu'];
    $test = $test + 1;
}
if (isset($_POST['mode'])) {
    $mode = $_POST['mode'];
    $test = $test + 1;
}
if ($test == 2) {
?>
<form action="LiaisonCompose.php" method="post">
<h5>Etape</h5>
<select name="Etape">
  <?php
    $req      = 'SELECT Etape.NomEtape FROM Etape WHERE Etape.NomEtape LIKE' . $jeu . '_' . $mode . '_%;';
    $resultat = $dbh->query($req);

    while ($ligne = $resultat->fetch()) {
        echo "<option>" . $ligne[0];
    }
?>
</select>
<br /><br />
<input type="submit" value="Valider">
</form>
<?php
} elseif ($test == 1) {
    echo "Missing data";
} else {
    echo "No data";
}
?>

et j'envoie ceci à mon fichier php

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    function chk() {
        var jeu = document.getElementById('liaisonJeu').value;
        var mode = document.getElementById('liaisonMode').value;
        $.ajax({
            type: 'post';
            url: "afficheEtapepourLiasion.php",
            data: {
                jeu: jeu,
                mode: mode
            },
            cache: false,
            success: function(html) {
                $('#LiaisonCompose').html(html);
            }
        });
        return false;
    }
</script>

<form>
    <h5>Jeu</h5>
    <select name="Jeu" id="liaisonJeu">
        <?php
         $req='SELECT Jeu.NomJeu FROM Jeu';
         $resultat=$dbh->query($req);

         while ($ligne=$resultat->fetch()) {
           echo "<option>".$ligne[0];
         }
         ?>

    </select>

    <h5>Mode</h5>
    <select name="Mode" id="liaisonMode">
        <?php
         $req='SELECT Mode.NomMode FROM Mode';
         $resultat=$dbh->query($req);

         while ($ligne=$resultat->fetch()) {
           echo "<option>".$ligne[0];
         }
         ?>

    </select>
    <input type="submit" value="Afficher" onclick="return chk()">
</form>

<div id="LiaisonCompose"></div>

mais quand je soumets sur le premier formulaire, il rafraîchit la page sur rien

php jquery ajax

0 commentaires

3 Réponses :

0
votes

Ajouter onsubmit = "return chk ()" à votre

fera l'affaire

Mais de toute façon s'il y a une erreur dans javascript, il sera publié

Pour cela, vous devez vérifier la console de votre navigateur (F12) peut-être qu'il y a quelque chose que je n'ai pas vu dans votre code!

2 commentaires

voici ce que j'obtiens sur la console ReferenceError: chk is not defined [Learn More] FormulaireInsertion.php: 1: 1 SyntaxError: missing} after property list [Learn More] FormulaireInsertion.php: 14: 21 note: {ouvert à la ligne 13, colonne 15FormulaireInsertion.php: 13: 15

c'est ici type: 'post'; doit être type: 'post',

1
votes

il semble que mon premier problème ait été la présence d'un ";" au lieu d'un "," sur:

 $.ajax({
            type: 'post'; <--- here
            url: "afficheEtapepourLiasion.php",
            data: {
                jeu: jeu,
                mode: mode
            },

mais quand je le soumets, rien ne se passe sauf pour la page qui semble s'actualiser et revenir dessus

MODIFIER: maintenant ça marche, mes étapes apparaissent (c'est parce que j'ai fait une erreur en supprimant du html

0 commentaires

1
votes

ici type: 'post'; au lieu de ; mettre , ie: type: 'post', code > .essayez comme ci-dessous:

 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
    <h5>Jeu</h5>
    <select name="Jeu" id="liaisonJeu">
        <?php
         $req='SELECT Jeu.NomJeu FROM Jeu';
         $resultat=$dbh->query($req);

         while ($ligne=$resultat->fetch()) {
           echo "<option value='$ligne[0]'>".$ligne[0];."</option>"
         }
         ?>

    </select>

    <h5>Mode</h5>
    <select name="Mode" id="liaisonMode">
        <?php
         $req='SELECT Mode.NomMode FROM Mode';
         $resultat=$dbh->query($req);

         while ($ligne=$resultat->fetch()) {
           echo "<option value='$ligne[0]'>".$ligne[0]."</option>"
         }
         ?>

    </select>
    <input type="submit" value="Afficher" onclick="return chk()">
</form>

<div id="LiaisonCompose"></div>
function chk(){
        var jeu = document.getElementById('liaisonJeu').value;
        var mode = document.getElementById('liaisonMode').value;
        alert("hi");
        $.ajax({
            type: 'post',
            url: "afficheEtapepourLiasion.php",
            data: {
                jeu: jeu,
                mode: mode
            },
            cache: false,
            success: function(html) {
                $('#LiaisonCompose').html(html);
            }
        });
        return false;
    }

`

0 commentaires