Deux submit dans une même page

Version imprimable

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:

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>

07/11/2024, 16h21
NoSmoking

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 !

Citation:

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.

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:

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>

07/11/2024, 19h41
NoSmoking
Citation:

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 :
- Comprendre les mécanismes d'AJAX
- Utiliser XMLHttpRequest
- Utiliser l'API Fetch, « plus moderne »
08/11/2024, 09h09
Raptor92

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
12/11/2024, 09h26
Raptor92

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
13/11/2024, 19h09
NoSmoking

Citation:

Malgré la lecture, j'avoue ne pas savoir comment débuter le code Ajax.

je dirais qu'il te faut un unique formulaire avec un bouton submit qui envoie toutes les données en même temps.

L'envoi se fera via la méthode Ajax comme indiquée.

Difficile d'en dire plus, regarde à toute fins utiles Calcul automatique d'un panier proposé dans cette discussion.

Bonjour,

J'ai avancé sur le sujet, et le code ci-dessous commence à fonctionner, néanmoins, je souhaiterais savoir comment optimiser 2 points:
1- En lieu et place de renseigner les tailles dans un array, je souhaiterais les appeler via une requête PHP
2- Comment puis-je passer outre le submit qui me sert à afficher le détail "fournisseur"

Le code:

Code:

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
<!DOCTYPE html>
<html>
 
<head>
    <link rel="stylesheet" href="../assets/css/panier.css">
    <title>Page Title</title>
</head>
 
<body>
    <?php $p2 = array(
        "S-XXXL" => array("S", "M", "L", "XL", "XXL", "XXXL"),
        "34-48" => array("34", "36", "38", "40", "42", "44", "46", "48"),
        "50-64" => array("50", "52", "54", "56", "58", "60", "62", "64"),
        "TU" => array("TU"),
        "KG" => array("GR", "KG", "ML", "CL", "DL", "LITRE")
    ); ?>
 
    <!-- SUPPLIER SELECT -->
    <form method="post" action="">
        <?php require('../Ecommerce/include/rec/supSelect.php'); ?>
        </select>&nbsp;<input type="submit" 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><br>
        <!-- COLORS -->
        <div>
            <!-- 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;
 
        <!-- SIZE SELECT -->
        <select name="monSelect" onchange="changeSelect(this);">
            <option value="S-XXXL">S-XXXL</option>
            <option value="34-48">34-48</option>
            <option value="50-64">50-64</option>
            <option value="TU">TU</option>
            <option value="KG">KG</option>
        </select>
 
        <select name="S2" id="S2" multiple="multiple" class="selecColor">
            <option  value="rien">Mon choix...</option>
        </select>
        </div>	
 
    </form>
    <!-- Script des tailles -->
    <script>
        function changeSelect(selected) {
            //on recupere le php
            var data = <?php echo json_encode($p2); ?>;
            console.log("selected.value : " + selected.value + ", data[selected.value] : " + data[selected.value]);
            var S2 = document.getElementById("S2");
            //on efface tous les children options
            while (S2.firstChild) {
                S2.removeChild(S2.firstChild);
            }
            //on rajoute les nouveaux children options
            for (var chaqueSousTitre of data[selected.value]) {
                var opt = document.createElement("option");
                opt.value = chaqueSousTitre;
                opt.innerHTML = chaqueSousTitre;
                S2.appendChild(opt);
            }
        }
    </script>
</body>
 
</html>

Est il possible de me mettre sur la voie
Bien à vous

15/11/2024, 10h19
gabi7756

Bonjour,
Rien compris , j'espère être le seul :weird:
16/11/2024, 18h31
NoSmoking
Citation:

1- En lieu et place de renseigner les tailles dans un array, je souhaiterais les appeler via une requête PHP

Rien ne t'empêche de faire ta requête et de stocker le traitement dans une variable que tu injectes dans la partie script comme tu l'as fait à cette ligne :

Code:

var data = <?php echo json_encode($p2); ?>;

Citation:

2- Comment puis-je passer outre le submit qui me sert à afficher le détail "fournisseur"

Difficile de répondre, on ne voit pas où sont intégrées les données fournisseur, visiblement dans :
Code:

1 2 <?php require('../Ecommerce/include/rec/supSelect.php'); ?> </select> <input type="submit" onclick="this.form.submit();" class="btn" name="Envoi" id="Envoi" value="Afficher"><br>
Cela reste toutefois assez vague, on ne connait pas toutes les liaisons, combien de fournisseurs, même taille pour tous les fournisseurs ? .. etc ...

Est-on dans le cas de listes liées ?

Bonjour,

j'ai finalement revu mon idée première compte tenu que la finalité de ma demande résulte dans le fait de sélectionner un fournisseur dans un select et d'afficher les coordonnées du dit fournisseur en dessous sans recharger la page bien entendu.
Il m'a fallu du temps pour comprendre la partie JS et je suis arrivé à ce résultat

Concernant le nombre de fournisseur, il n'y a pas de limite

Parie HTML: (Page index.php)

Code:

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
<?php
require_once("database_connect.php");
$db = new DB();
$query ="SELECT SUP_NAME FROM SUPPLIER";
$results = $db->runQuery($query);
?>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title>Liaison entre deux liste déroulante pays et ville</title>
        <head>
 
            <script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
            <script>
                                function getVille(val) {
                                        $.ajax({
                                        type: "POST",
                                        url: "get_sup.php",
                                        data:'id_pays='+val,
                                        success: function(data){
                                                $("#list-ville").html(data);
                                        }
                                        });
                                }
 
                function selectCountry(val) {
                    $("#search-box").val(val);
                    $("#suggesstion-box").hide();
                }
            </script>
        </head>
 
        <body>
            <style>
                .boxInput {
                    border: #414B56 1px solid;
                    background-color: #fff;
                    border-radius: 4px;
                    width: 220px;
                    height: 30px;
                }
                .boxInput1 {
                    padding: 10px;
                    border: #414B56 1px solid;
                    border-radius: 4px;
                    width: 350px;
                }
            </style>
            <div class="form">
                <div class="row">
                    <label>Pays:</label>
                    <br/>
                    <select name="pays" id="liste-pays" class="boxInput" onChange="getVille(this.value);">
                        <option value="">Sélectionnez le pays</option>
						<?php
                                                foreach($results as $pays) {
                                                ?>
							<option value="<?php echo $pays["SUP_NAME"]; ?>"><?php echo $pays["SUP_NAME"]; ?></option>
						<?php
                                                }
                                                ?>
					</select>
                </div>
                <div class="row">
                    <br/>
                    <div name="ville" id="list-ville" class="boxInput1" >
 
                    </div>
                </div>
            </div>
        </body>
    </html>

Partie requête: (get_sup.php)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
require_once("database_connect.php");
$db = new DB();
if(!empty($_POST["id_pays"])) {
        $query ="SELECT SUP_CODE,SUP_ADDR1,SUP_ADDR2,SUP_ZIP,SUP_VILLE,SUP_PAYS FROM SUPPLIER  WHERE SUP_NAME = '" . $_POST["id_pays"] . "'";
        $results = $db->runQuery($query);
        foreach($results as $ville) {
?>
	 <option value="<?php echo $ville["SUP_CODE"]; ?>"><?php echo $ville["SUP_CODE"]; ?></option>
	 <option value="<?php echo $ville["SUP_ADDR1"]; ?>"><?php echo $ville["SUP_ADDR1"]; ?></option>
	 <option value="<?php echo $ville["SUP_ADDR2"]; ?>"><?php echo $ville["SUP_ADDR2"]; ?></option>
	 <option value="<?php echo $ville["SUP_ZIP"]; ?>"><?php echo $ville["SUP_ZIP"]; ?></option>
	 <option value="<?php echo $ville["SUP_VILLE"]; ?>"><?php echo $ville["SUP_VILLE"]; ?></option>
	 <option value="<?php echo $ville["SUP_PAYS"]; ?>"><?php echo $ville["SUP_PAYS"]; ?></option>
 
<?php
        }
}
?>

J'avoue m'être inspirer d'un exemple que j'ai adapté à mon besoin.
Le code fonctionne

Mais...................

Je n'arrive pas à remplacer les champs <option> par des input, auriez vous une idée pour me mettre sur une piste
Merci beaucoup

Bonjour,

Citation:

Envoyé par Raptor92

Je n'arrive pas à remplacer les champs <option> par des input

Au début tu voulais une liste et maintenant des inputs ? Hum ... :mouarf:

Il faudrait peut être changer le select par autre chose ...
C'est ici que y a du changement à faire du coup
Code:

1 2 3 4 5 6 7 <option value="<?php echo $ville["SUP_CODE"]; ?>"><?php echo $ville["SUP_CODE"]; ?></option> <option value="<?php echo $ville["SUP_ADDR1"]; ?>"><?php echo $ville["SUP_ADDR1"]; ?></option> <option value="<?php echo $ville["SUP_ADDR2"]; ?>"><?php echo $ville["SUP_ADDR2"]; ?></option> <option value="<?php echo $ville["SUP_ZIP"]; ?>"><?php echo $ville["SUP_ZIP"]; ?></option> <option value="<?php echo $ville["SUP_VILLE"]; ?>"><?php echo $ville["SUP_VILLE"]; ?></option> <option value="<?php echo $ville["SUP_PAYS"]; ?>"><?php echo $ville["SUP_PAYS"]; ?></option>
Cdt

25/11/2024, 16h16
Raptor92

Bonjour,

Je me doute bien que c'est à cet endroit, ce que je souhaite, c'est une piste.
Je vais attendre de voir si quelqu'un peut me guider
Merci
25/11/2024, 16h36
gabi7756
Citation:

Envoyé par Raptor92

Bonjour,

Je me doute bien que c'est à cet endroit, ce que je souhaite, c'est une piste.

Tu veux une piste ? Je t'en donne une deuxième :
Code:

1 2 3 4 5 6 <?php $ville["SUP_CODE"]="1,2,3,soleil"; ?> <input type="text" id="SUP_CODE" name="SUP_CODE" value="<?php echo $ville['SUP_CODE']; ?>" />
Cdt
25/11/2024, 16h54
Raptor92

Je ne sais pas si cela est de l'humour ou autre chose.
25/11/2024, 17h07
gabi7756

Citation:

Envoyé par Raptor92

Je ne sais pas si cela est de l'humour ou autre chose.

Tu demandes des pistes , je t'en donne ....
Qu'est ce que tu as besoin en plus ? Des questions ? ;)
25/11/2024, 19h03
Raptor92

je ne comprends pas ce que vous voulez faire.
J'ai tenté de remplacer les champs <option> par des input mais cela ne fonctionne pas
26/11/2024, 10h34
gabi7756

Citation:

Envoyé par Raptor92

je ne comprends pas ce que vous voulez faire.
J'ai tenté de remplacer les champs <option> par des input mais cela ne fonctionne pas

Tu me dis que tu veux remplacer tes options par des input , soit , donc la balise html ou tu insères tes datas , c'est plus un select, ca pourrait être un div par exemple .

Dans ma "deuxième piste" je te montre comment changer une option pour la remplacer par un input.

Qu'est ce qu'il y a de pas clair ?
Cela ne fonctionne pas ? C'est à dire ? C'est un peu maigre comme réponse le : ca ne fonctionne pas

Cdt
26/11/2024, 12h09
Raptor92

Si cela était clair, je ne reviendrais pas demander de l'aide, j'ai déjà tenté de le faire.
Si vous remplacez les balises <option> par des input, la balise <select> me donne bien les fournisseurs mais n'affiche plus les input.
Pourtant, les 2 s'affichent dans un <div>.

Reprenons sereinement ;)

Pour commencer il serait préférable, que lors de tes requêtes, tu retournes non pas du code HTML mais un objet JSON, via par exemlpe json_encode(), plus léger en transfert et plus souple à exploiter côté client (navigateur).

Lorsque l'on offre des choix, c'est visiblement le cas pour tes fournisseurs, l'élément HTML qui convient bien est un <select>.
Lorsque l'on donne la possibilité de modifier les données, typiquement une quantité de produit, une taille ..., l'élément HTML qui convient bien est un <input> quelque soit son type.
Lorsque l'on soumet pour affichage, typiquement les informations sur un fournisseur adresse, téléphone, numéro de Siret ..., l'élément HTML qui convient bien est un <span>, <ouput> ou autre élément neutre.

Dans tous ces cas la mise en forme est une question de CSS.

Avec la réponse JSON en retour tu auras, au moins, deux façons de faire côté client. Soit tu construis ton DOM dynamiquement en créant les éléments nécessaire à l'affichage, soit ces éléments existent déjà dans la page et il suffit donc de les remplir avec les données reçues.
Exemple de HTML présent :
Code:

1 2 3 4 5 6 7 8 <section> <h2>Infos fournisseur</h2> <div id="info-fournisseur"> <p><span class="label-info">Nom</span><output id="name"></output> <p><span class="label-info">Adresse</span><output id="adress"></output> <p><span class="label-info">Téléphone</span><output id="phone"></output> </div> </section>
Exemple de retour serveur :
Code:

1 2 3 4 5 { "name": "La Haut", "adress": "sur la colline", "phone": "012345678" }
il te suffit de mettre les valeurs au bon endroit !

27/11/2024, 18h44
Raptor92

Bonsoir,

Mille merci pour ces explications, c'est limpide
Je modifie mon code et reviendrais le soumettre et ainsi mettre le sujet en "résolu"
Bonne soirée
29/11/2024, 09h10
Raptor92

Bonjour,

Je vous remercie beaucoup pour votre soutien, j'ai testé votre solution, et tut fonctionne comme je le souhaitais.
De fait, toutes mes balises <select> fonctionnent sans avoir besoin de rafraichir la page et je n'ai besoin que d'un seul 'submit' pour enregistrer
Encore merci
29/11/2024, 14h55
NoSmoking

Citation:

De fait, toutes mes balises <select> fonctionnent sans avoir besoin de rafraichir la page

juste par curiosité, tu as opté pour quelle méthode de transfert JSON ou HTML ?