Deux submit dans une même page

**Raptor92** · 07/11/2024, 09h18

Bonjour,

Malgré mes recherches, je n'arrive pas à résoudre mon problème.
J'ai une page avec des onglets et souhaite afficher différentes informations sur chacun des onglets, j'ai un input de type submit sur chaque onglet mais lorsque je clic sur l'un, les infos de l'autre disparaissent.
Auriez vous une idée svp
Merci beaucooup

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../assets/css/panier.css">
    <title>Document</title>
</head>
 
<body>
    <form method="post" action="">
 
        <?php
        try {
            $bdd = new PDO('mysql:host=localhost;dbname='';charset=utf8', '', '');
        } catch (Exception $e) {
            die('Erreur : ' . $e->getMessage());
        }
        $query = $bdd->prepare('SELECT SUP_CODE,SUP_NAME FROM SUPPLIER ORDER BY SUP_NAME ASC');
        $query->execute();
        echo '<label for="pet-select">Fournisseur :</label>&nbsp;';
        echo '<select class="selecteur"  name="sup-select" id="togg2" value="Sélectionner le fournisseur">';
        echo '<option value="">Sélectionner votre fournisseur</option>';
        while ($data = $query->fetch()) {
            echo '<option value="' . $data['SUP_CODE'] . '","' . $data['SUP_NAME'] . '">' . $data['SUP_NAME'] . '-' . $data['SUP_CODE'] . '</option>';
        }
        ?>
        &nbsp;<input type="submit" class="btn" name="envoi" id="envoi" value="Afficher"><br><br>
 
        <?php
        if (isset($_POST['envoi']) and $_POST['envoi'] == 'Afficher') {
            try {
                $bdd = new PDO('mysql:host=localhost;dbname='';charset=utf8', '', '');
            } catch (Exception $e) {
                die('Erreur : ' . $e->getMessage());
            }
            $query = $bdd->prepare('SELECT SUP_CODE,SUP_NAME,SUP_ADDR1,SUP_ADDR2,SUP_ZIP,SUP_VILLE,SUP_PAYS FROM SUPPLIER 
        WHERE SUP_CODE="' . $_POST['sup-select'] . '" ');
            $query->execute();
            while ($data = $query->fetch()) {
        ?><br><br>
                <div>
                    <label for="">Code four.</label>&nbsp;
                    <input type="text" class="input-div2" name="codesup" value="<?php echo $data['SUP_CODE']; ?>">&nbsp;&nbsp;
                    <label for="">Raison sociale</label>&nbsp;
                    <input type="text" class="input-div2" name="namesup" value="<?php echo $data['SUP_NAME']; ?>"><br><br>
                    <label for="">Adresse</label>&nbsp;
                    <input type="text" class="input-div2" value="<?php echo $data['SUP_ADDR1']; ?>">&nbsp;&nbsp;
                    <label for="">Complément</label>&nbsp;
                    <input type="text" class="input-div2" value="<?php echo $data['SUP_ADDR2']; ?>"><br>
                    <label for="">Code postal</label>&nbsp;
                    <input type="text" class="input-div2" value="<?php echo $data['SUP_ZIP']; ?>"><br>
                    <label for="">Ville</label>&nbsp;
                    <input type="text" class="input-div2" value="<?php echo $data['SUP_VILLE']; ?>"><br>
                    <label for="">Pays</label>&nbsp;
                    <input type="text" class="input-div2" value="<?php echo $data['SUP_PAYS']; ?>">
                </div>
 
        <?php }
        }
        ?>
 
        <br><br><br><br><br><br><br><br><br><br><br><br>
 
        <fieldset>
            <legend><b>Grille de taille</b></legend>
            <input type="radio" name="taille[]" onclick="this.form.submit()" value="S-XXXL" />S-XXXL<br />
            <input type="radio" name="taille[]" onclick="this.form.submit()" value="34-48" />34-48<br />
            <input type="radio" name="taille[]" onclick="this.form.submit()" value="50-64" />50-64<br />
            <input type="radio" name="taille[]" onclick="this.form.submit()" value="TU" />T.U.<br />
            <input type="radio" name="taille[]" onclick="this.form.submit()" value="KG" />KG<br />
            <input type="submit" class="btn" name="submit" id="submit" value="Affichage">
 
        </fieldset><br>
 
        <?php
        if (isset($_POST['submit']) and $_POST['submit'] == 'Affichage') {
 
            foreach ($_POST['taille'] as $val) {
                //Do something 
                echo  'Grille : ' . $val . '<br/>';
                try {
                    $bdd = new PDO('mysql:host=localhost;dbname='';charset=utf8', '', '');
                } catch (Exception $e) {
                    die('Erreur : ' . $e->getMessage());
                }
                $query = $bdd->prepare('SELECT TAILLE_CODE FROM TAILLES WHERE TAILLE_LIBELLE="' . $val . '" ');
                $query->execute();
                echo '<select multiple="multiple" class="selecColor" name="size[]" id="size">';
                while ($data = $query->fetch()) {
                    echo '<option value="' . $data['TAILLE_CODE'] . '">' . $data['TAILLE_CODE'] . '</option>';
                }
            }
        }
        ?>
    </form>
</body>
 
</html>

**NoSmoking** · 07/11/2024, 16h21

Bonjour,
ton code PHP ne nous est d'aucune aide pour appréhender ton problème, mets nous le code HTML généré, on y verra peut-être plus clair !

mais lorsque je clic sur l'un, les infos de l'autre disparaissent.

ceci étant au submit du formulaire, ta page est rechargée donc les informations sont perdues.

**Raptor92** · 07/11/2024, 16h43

Bonjour,

Le code précédent a été extrait de celui-ci, plus facile pour moi pour comprendre, voici le code entier
Et le fait que les informations disparaissent lors du clic est justement mon problème
Et merci beaucoup pour votre aide

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
<!DOCTYPE html>
<html lang="fr">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../assets/css/panier.css">
    <title>Articles</title>
    <script src="../js/clicDroit.js"></script>
    <title>Gestion des articles</title>
</head>
 
<body>
    <!-- BARRE DE NAVIGATION GENERALE -->
    <ul>
        <li><a onclick="openTab(0)" href="#home">Fournisseur</a></li>
        <li><a onclick="openTab(1)" href="#couleurs">Coloris & Tailles</a></li>
        <li><a onclick="openTab(2)" href="#comments" id="togg3">Commentaires</a></li>
        <li class="logo"><a href="">SIMAG Solution*</a></li>
    </ul>
    <br>
    <!-- ITEM 1 -->
    <form method="post">
            <div>
                <label for="">Code article :</label>&nbsp;
                <input class="input-div" type="text" name="artCode" id="artCode">&nbsp;&nbsp;
                <label for="">Libellé :</label>&nbsp;
                <input class="input-div1" type="text" name="libelle" id="libelle">&nbsp;&nbsp;
                <label for="">Désignation :</label>&nbsp;
                <input class="input-div1" type="text" name="design" id="design">&nbsp;&nbsp;
                <!-- Sélecteur catégorie -->
                <?php require('../Ecommerce/include/categorie.php');  ?>
                </select>&nbsp;
                <label for="">Date :</label>
                <input class="input-div1" type="date" readonly="readonly" name="date" id="Aujourdhui">
                <script>
                    document.getElementById("Aujourdhui").valueAsDate = new Date();
                </script>
            </div>
 
        <br><br><br><br><br><br>
 
        <!-- BARRE DE NAVIGATION INTERNE -->
        <ul>
            <li><a href="#home"></a></li>
        </ul>
        <br><br>
 
        <!-- ONGLET 0  -->
 
            <?php require('../Ecommerce/include/rec/supSelect.php'); ?>
            </select>&nbsp;<input type="button" onclick="this.form.submit();" class="btn" name="Envoi" id="Envoi" value="Afficher"><br>
 
            <div class="tab-content" style="display: block;">
                <?php require('../Ecommerce/include/rec/supSelect1.php'); ?>
            </div><br>
    </form>
 
            <!-- ONGLET 1  -->
            <div class="tab-content">
 
                <div id="myform">
                    <!-- Couleur -->
                    <?php require('../Ecommerce/include/rec/artColors.php'); ?>
                    </select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 
                    <!-- Taille  -->
 
                <form method="post" action="">
                    <div>
                            <fieldset>
                                <legend><b>Grille de taille</b></legend>
                                <input type="radio" name="taille[]"  value="S-XXXL" />S-XXXL<br />
                                <input type="radio" name="taille[]"  value="34-48" />34-48<br />
                                <input type="radio" name="taille[]"  value="50-64" />50-64<br />
                                <input type="radio" name="taille[]"  value="TU" />T.U.<br />
                                <input type="radio" name="taille[]"  value="KG" />KG<br />
                            </fieldset><br>
                            <input type="submit" onclick="this.form.submit();" class="btn" name="Envoi" id="Envoi" value="Afficher">
                    </div>
                </form>
                    <div style="display: block;">
                        <?php require('../Ecommerce/include/rec/artTaille.php'); ?>
                        </select>
                    </div>  
 
             </div>
 
    <!-- ONGLET 2  -->
 
        <div class="tab-content">
            <label for="">Commentaires</label><br>
            <textarea class="textarea" name="comments" id="comments"></textarea>
            <br><br>
            <input type="submit" class="save" name="submit" value="Enregistrement">&nbsp;&nbsp;
            <input type="submit" class="reset" name="submit" value="Abandon">
        </div>
 
 
</body>
 
<script>
    // Affichage du select Supplier au select catégorie
    let togg1 = document.getElementById("togg1");
    let d1 = document.getElementById("d1");
    togg1.addEventListener("click", () => {
        if (getComputedStyle(d1).display != "none") {
            d1.style.display = "block";
        } else {
            d1.style.display = "block";
        }
    })
</script>
<script>
    // Affichage des input au Select Supplier
    let togg2 = document.getElementById("togg2");
    let d2 = document.getElementById("d2");
    togg2.addEventListener("click", () => {
        if (getComputedStyle(d2).display != "none") {
            d2.style.display = "block";
        } else {
            d2.style.display = "block";
        }
    })
</script>
 
<!-- <script src=""></script> -->
<script>
    // Fonctionnement de l'onglet 
    function openTab(x) {
        let contents = document.querySelectorAll(".tab-content");
        let btns = document.querySelectorAll("a");
        for (let i = 0; i < contents.length; i++) {
            contents[i].style.display = "none";
            btns[i].classList.remove("active");
        }
        //Tous les contents ont display none
        contents[x].style.display = "block";
        btns[x].classList.add("active");
    }
</script>
<!-- Prépa pour insert onglet 0 -->
<?php
if (isset($_POST['insert'])) { // si formulaire soumis
    echo $_POST['artCode'];
    echo $_POST['libelle'];
    echo $_POST['design'];
    echo $_POST['categorie'];
    echo $_POST['sup-select'];
    echo $_POST['date'];
}
if (isset($_POST['colors'])) {
    $cars_string = implode(', ', $_POST['colors']);
    echo $_POST['colors'];
}
if (isset($_POST['size'])) {
    echo $_POST['size'];
}
?>
 
 
 
</html>

**NoSmoking** · 07/11/2024, 19h41

Et le fait que les informations disparaissent lors du clic est justement mon problème

pour que la page ne se rafraichisse pas il te faut utiliser la « technique Ajax »

Ressources :

**Raptor92** · 08/11/2024, 09h09

Bonjour,

Je vais travailler dans ce sens et ne clôture pas le sujet, il me faut comprendre et revenir avec mon code modifier
Merci beaucoup

**Raptor92** · 12/11/2024, 09h26

Bonjour,

Malgré la lecture, j'avoue ne pas savoir comment débuter le code Ajax.
Serait il possible de me mettre sur la voie
Merci beaucoup

Deux submit dans une même page

HTML

Vue hybride

Discussions similaires

Partager

Partager