Création formulaire avec boutons + pour ajout ligne
pilten
Messages postés
41
Date d'inscription
Statut
Membre
Dernière intervention
-
Anonymous -
Anonymous -
Bonjour à tous,
J'ai un petit soucis dans le dév de mon application web.
Imaginons l'exemple suivant : J'ai créé un formulaire pour pouvoir ajouter des produits dans une database
(1 ligne = 1 champ "Produit", 1 champ "prix")
** le champ produit est une liste "selected from database"
Je n'ai pas envie de prédéfinir un nombre de lignes maximum. J'aimerais simplement afficher une ligne Avec un bouton + qui permettra d'ajouter des lignes.
Je programme en Javascript la fonction "nouvelle ligne", histoire de ne pas rafraîchir la page forcément.
Voici un exemple du code de la page
<html>
<head>
function Ajouter(){
var newRow = document.getElementById('matable').insertRow(-1);
var newCell = newRow.insertCell(0);
newCell.innerHTML = "<?php
OpenStreamDB();
$sql = "SELECT * FROM produit'";
$res = mysql_query($sql);
Disconnect();
echo "<select name='produit'>";
echo "<OPTION value='0'>Choisir un produit</OPTION>";
while($j = mysql_fetch_object($res)){
echo "<OPTION value='$j->id_bonus'>$j->desc_bonus</OPTION>";
}
echo "</select>";
?>";
newCell = newRow.insertCell(1);
newCell.innerHTML = "Prix <input type='text' name='prix' size='5'>";
};
</head>
<body>
<table id='matable'>
</table>
</body>
</html>
A mon avis, ce n'est pas très propre comme fonction JS mais cela marche.
Par contre, je ne sais pas comment faire pour que les "NAME" variable aient des valeurs différentes à chaque nouvelle ligne
Je présume que je dois utiliser une variable Javascript à incrémenter à chaque nouvel appel de fonction.
Mais comment vais je écrire cette variable JS dans mon code PHP
Bref, je cale !
Merci d'avance
J'ai un petit soucis dans le dév de mon application web.
Imaginons l'exemple suivant : J'ai créé un formulaire pour pouvoir ajouter des produits dans une database
(1 ligne = 1 champ "Produit", 1 champ "prix")
** le champ produit est une liste "selected from database"
Je n'ai pas envie de prédéfinir un nombre de lignes maximum. J'aimerais simplement afficher une ligne Avec un bouton + qui permettra d'ajouter des lignes.
Je programme en Javascript la fonction "nouvelle ligne", histoire de ne pas rafraîchir la page forcément.
Voici un exemple du code de la page
<html>
<head>
function Ajouter(){
var newRow = document.getElementById('matable').insertRow(-1);
var newCell = newRow.insertCell(0);
newCell.innerHTML = "<?php
OpenStreamDB();
$sql = "SELECT * FROM produit'";
$res = mysql_query($sql);
Disconnect();
echo "<select name='produit'>";
echo "<OPTION value='0'>Choisir un produit</OPTION>";
while($j = mysql_fetch_object($res)){
echo "<OPTION value='$j->id_bonus'>$j->desc_bonus</OPTION>";
}
echo "</select>";
?>";
newCell = newRow.insertCell(1);
newCell.innerHTML = "Prix <input type='text' name='prix' size='5'>";
};
</head>
<body>
<table id='matable'>
</table>
</body>
</html>
A mon avis, ce n'est pas très propre comme fonction JS mais cela marche.
Par contre, je ne sais pas comment faire pour que les "NAME" variable aient des valeurs différentes à chaque nouvelle ligne
Je présume que je dois utiliser une variable Javascript à incrémenter à chaque nouvel appel de fonction.
Mais comment vais je écrire cette variable JS dans mon code PHP
Bref, je cale !
Merci d'avance
A voir également:
- Création formulaire avec boutons + pour ajout ligne
- Whatsapp formulaire opposition - Guide
- Partager photos en ligne - Guide
- Formulaire de réclamation facebook - Guide
- Creation compte gmail - Guide
- Création site web - Guide
1 réponse
Bonjour,
Avant tout et par soucis de confort, je te conseil de jeter un oeil du coté de jQuery (particulièrement la fonction .clone()) qui te simplifiera la vie.
Pour l'ajout de la ligne, l'insertion de PHP au milieu de javascript est complètement inutile, pour plusieurs raison, déjà, parce que, première régle de base : PHP est un langage coté serveur, alors que JS se passe coté client, ce qui veut dire que lors de l'affichage de ta page, le PHP est traité pour être converti en un résultat HTML, et le JS lui n'est exécuté qu'après que la page soit affichée. Donc là, le PHP ne sera jamais exécuté, par contre il risque d'être affiché sur la page.
La solution serait simplement de récupérer le code HTML de ta dernière ligne, et de le réinsérer à la suite ce qui, si tu utilise un tableau et jQuery se traduirait simplement par ceci :
Pour les attributs "name", plutôt que de donner un name différent à chaque ligne, la meilleure solution serait de donner un tableau à toute tes lignes, comme ceci :
La première ligne aura les valeurs suivantes : $_POST['produit'][0] et $_POST['prix'][0]
La seconde : $_POST['produit'][1] et $_POST['prix'][1]
Et ainsi de suite (il ne te reste donc qu'à boucler sur les variables POST pour récupérer les infos.)
Avant tout et par soucis de confort, je te conseil de jeter un oeil du coté de jQuery (particulièrement la fonction .clone()) qui te simplifiera la vie.
Pour l'ajout de la ligne, l'insertion de PHP au milieu de javascript est complètement inutile, pour plusieurs raison, déjà, parce que, première régle de base : PHP est un langage coté serveur, alors que JS se passe coté client, ce qui veut dire que lors de l'affichage de ta page, le PHP est traité pour être converti en un résultat HTML, et le JS lui n'est exécuté qu'après que la page soit affichée. Donc là, le PHP ne sera jamais exécuté, par contre il risque d'être affiché sur la page.
La solution serait simplement de récupérer le code HTML de ta dernière ligne, et de le réinsérer à la suite ce qui, si tu utilise un tableau et jQuery se traduirait simplement par ceci :
var html = $('#matable tr:last').html();
$('#matable').append('<tr>'+html+'</tr>'); et le tour est joué.
Pour les attributs "name", plutôt que de donner un name différent à chaque ligne, la meilleure solution serait de donner un tableau à toute tes lignes, comme ceci :
<input type="text" name="prix[]" value="" size="5" />Le fait de mettre deux crochets à la fin du name permet de récupérer un tableau. Ainsi en php tu aura quelque chose comme ca :
La première ligne aura les valeurs suivantes : $_POST['produit'][0] et $_POST['prix'][0]
La seconde : $_POST['produit'][1] et $_POST['prix'][1]
Et ainsi de suite (il ne te reste donc qu'à boucler sur les variables POST pour récupérer les infos.)
Merci à toi Dj Nam