Alimenter des select créés par createElement ?
Résolu/Fermé
emrh Messages postés 427 Date d'inscription mardi 9 décembre 2014 Statut Membre Dernière intervention 9 avril 2024 - 26 août 2022 à 11:36
- Alimenter des select créés par createElement ?
- Créer un lien pour partager des photos - Guide
- Créer une carte avec des points - Guide
- Créer une table des matières word - Guide
- Gmail créé par - Guide
- Reboot and select proper boot device asus - Forum Matériel & Système
3 réponses
Bonjour,
1. Tu peux appeler directement la fonction dès la création du select sans passer par l'attribut onclick.
2. Tu peux passer le select à alimenter en paramètre de ta fonction RemplirSelect()
3. Le bug est surement lié à l'attribut onclick qui dois recharger les options lorsqu'on sélectionne une valeur, sans onclick tu ne devrais pas avoir ce problème.
Un début d'idée (code non testé) :
var entreeMidi = document.createElement('select');
entreeMidi.setAttribute('name', 'entree-midi' + jour);
entreeMidi.setAttribute('id', 'entree-midi' + jour);
entreeMidi.setAttribute('class', 'box-rglt-left');
RemplirSelect(entreeMidi, "entrée");
// ...
function RemplirSelect(select, typeRecette){
$.ajax({
type:'POST',
url:'recettes_data.php',
data:'RecetteType='+typeRecette,
success:function(html){
$(select).html(html);
}
});
}
25 août 2022 à 16:49
J'ai fait ça qui réagit pas trop mal, mais c'est pas encore ça !
var entreeMidi = document.createElement('select');
entreeMidi.setAttribute('name', 'entree-midi' + jour);
entreeMidi.setAttribute('id', 'entree-midi' + jour);
entreeMidi.setAttribute('class', 'box-rglt-left');
entreeMidi.setAttribute('onclick','RemplirSelect("entrée")');
.../...
function RemplirSelect(arg){
var typeRecette=arg;
$.ajax({
type:'POST',
url:'recettes_data.php',
data:'RecetteType='+typeRecette,
success:function(html){
$("#entree-midi1").html(html);
}
});
}
<?php
// Connexion à la base de données :
require ("../gestion/connexion.php");
if(!empty($_POST["RecetteType"])){
// Récupération des recettes relatives au type sélectionné :
$requete_recette = $bdd->prepare('SELECT * FROM recettes WHERE type = :type');
$requete_recette->execute(array(':type' => $_POST['RecetteType']));
$recettes=$requete_recette->fetchAll();
$nbr_recettes = $requete_recette->rowCount();
if($nbr_recettes>0){
// Génération du code HTML pour la liste d'options :
echo '<option value="">Recette ?</option>';
foreach($recettes as $valeur) {
echo '<option value="' . $valeur['id_recette'] . '">' . $valeur['nom'] . '</option>';
}
}
else {
echo '<option value="">Aucune recette</option>';
}
}
Il faut maintenant :
1. Que les SELECT se remplissent dès la création de la DIV.
2. Que la fonction RemplirSelect(arg) retourne les OPTIONS au bon SELECT
(Je suppose que c'est avec event, event.target, event.target.value mais je n'ai pas bien compris comment le faire fonctionner).
3. Que la valeur sélectionnée dans le SELECT reste sélectionnée, or là, le SELECT est réinitialisé dès qu'on le quitte !?
Merci d'avance pour votre aide !
26 août 2022 à 10:56
Bonjour Pitet,
Encore une fois tu me sauves, c'est exactement ce qu'il me fallait...
Donc pour bien comprendre :
La valeur recherchée (ex: entrée) dans la base de données est envoyée à la fonction par l'intermédiaire de RemplirSelect comme deuxième paramètre, le premier étant le nom de la variable utilisée à la création de l'élément (ici 'select').
Le deuxième paramètre est reçu par la fonction en deuxième place, c'est logique, pour pouvoir être passé comme valeur à ajax afin de faire la requête...
Par contre d'où sort le select dans function RemplirSelect(select, typeRecette){ ?
Il correspond à l'élément qui est créé ligne 1 ?
On peut donc passer à une fonctions des paramètres qui peuvent être des valeurs ou des objets (?) ou éléments créés ?
Oui les paramètres d'une fonction js peuvent être de n'importe quel type.
Le paramètre select correspond effectivement à l'élément créé via document.createElement('select'), permettant ainsi de choisir l'élément à remplir :
var entreeMidi = document.createElement('select');
entreeMidi.setAttribute('name', 'entree-midi' + jour);
RemplirSelect(entreeMidi, "entrée");
var entreeSoir = document.createElement('select');
entreeSoir.setAttribute('name', 'entree-soir' + jour);
RemplirSelect(entreeSoir, "soir");
// ...
function RemplirSelect(select, typeRecette){
console.log(select.name);
// ...
}
26 août 2022 à 11:36
C'est pourquoi je n'arrivais à rien en envoyant qu'un seul paramètre à ma fonction !
Merci pour ton aide et pour ce complément d'info !
