Bonjour,

J'explique, j'ai un formulaire contenant un tableau à remplir, voilà l'exemple:



Ce que j'ai exactement fait c'est:
* Créer le tableau.
* Créer des champs textes pour chaque case; 24 avec 24 name pour la récupération des données.
* récupérer les 24 variables!
* Insertion dans la bas.

Comme vous voyez, j'ai un grand nombre de cases à manipuler ...
récupération des données et insertion dans la base... c'est pas intelligent (Pour l'insertion j'ai créé une fonction avec des paramètres, pas mal!)



Je sens que j'aurais besoin d'autre chose que php, peut-être bien JQuery ou Javascript...

Si c'est le cas merci de me donner un peu de détails (car je ne connais pas vraiment grand chose, par exemple: nom des methodes à utiliser, démarche... etc)


Une dernière chose, j'aurais besoin plus tard d'une chose pareille..
un autre formulaire dynamique... je crois que c'est le même principe:



Merci, bonne journée

Salut !

Tu as la réponse dans ton sujet (en bas )

Si tu veux un nombre de ligne variable, ou tu le fais en PHP, donc là te faudra un autre formulaire.

1) Tu fais un formulaire qui demande combien de lignes
2) Tu crées le formulaire en fonction du nombre rentré

Soit tu le fais en freestyle, c'est à dire avec JavaScript, mais là je pourrais pas t'aider plus que ça

EDIT : pourquoi tu fais 24 déclarations de variables ?
Tu fais un for qui crée ton tableau, ça t'économisera bien des lignes/des variables/du temps...

Bonjour

Un petit conseil. Ce code :

<form method="post" action="cible.php" >
    <input type="text" name="dates_debut[]" /><br />
    <input type="text" name="dates_debut[]" /><br />
    <input type="text" name="dates_debut[]" /><br />
    <input type="text" name="dates_debut[]" /><br />
</form>

Va créer un array dans la variable $_POST['dates_debut'], avec une entrée pour chaque champ du formulaire.
Voilà qui devrait déjà faciliter ton traitement (foreach() est ton ami).

Ensuite, si tu veux pouvoir via un clic sur un bouton (par exemple) ajouter une ligne, alors oui, c'est en JavaScript que ça se fait.

Salut!

Alors, je ne sais pas comment tu construit ton formulaire ou que tu récupère tes données, mais moi quand j'ai un formulaire à nombre d champs variable je procède comme ceci:

<?php
//#### Pour le formulaire
//pour 3 champs:
$nbChamps = 3;
for($i=0; $i<$nbChamps; $i++)
  echo '<input type="text" name="date_entree['.$i.']"/>

echo '<input type="hidden" name="nbChamps" value="'.$nbChamps.'"/>

//#### Pour le traitement
//on récupère en premier le nombre de champs
$nbChamps = $_POST['nbChamps'];

//récupération des autres champs et stockage des valeur dans un tableau
for($i=0; $i<$nbChamps; $i++)
   $date_entree[$i] = $_POST['date_entree[$i]'];

//traitement des données
?>

Tu peux donc avec cette technique gérer le nombre de ligne dans ton tableau. Après pour un formulaire qui change "en live" par exemple en modifiant la valeur dans la liste déroulante qui ajoute ou enleve des chambre, oui c'est du javascript qui modifie le tableau html.
Pour ça je te conseilles du JQuery.


J'espère t'avoir aidé!

@herudo : Comme dit dans mon précédent post, il est inutile de créer des names "date_entree['.$i.']", car en mettant "date_entree[]" PHP va automatiquement créer un array, ce qui est bien plus pratique à traiter.

Du coup ton champ hidden devient inutile, car on peut connaitre le nombre d'éléments d'un array avec la fonction count().

Pour ce qui est du JavaScript, j'ai fait ça :

window.onload = function() {
	document.getElementById('addLine').onclick = function() {
		var inputs = document.getElementById('inputs');
		
		var input_text = document.createElement('input');
		input_text.setAttribute('type', 'text');
		input_text.setAttribute('name', 'dates_debut[]');
		
		var br = document.createElement('br');
		
		inputs.appendChild(input_text);
		inputs.appendChild(br);
	};
};

Ce qui va avec ce code HTML :

<form method="post" action="" >
    <div id="inputs">
    	<input type="text" name="dates_debut[]" /><br />
    </div>
    <input type="submit" /><input type="button" id="addLine" value="Ajouter une ligne" />
</form>

Citation : gyom

@herudo : Comme dit dans mon précédent post, il est inutile de créer des names "date_entree['.$i.']", car en mettant "date_entree[]" PHP va automatiquement créer un array, ce qui est bien plus pratique à traiter.

ça c'est top merci de l'info!

Tout d'abord merci à tous!!! *Ghost*, gyom et herudo

Citation : *Ghost*

Si tu veux un nombre de ligne variable, ou tu le fais en PHP, donc là te faudra un autre formulaire.

1) Tu fais un formulaire qui demande combien de lignes
2) Tu crées le formulaire en fonction du nombre rentré

C'est une manière de faire les choses, mais je l’apprécie pas bien
Peut être un bouton [+] et un autre [-] pour ajout/suppression de lignes ça sera plus beau!

Citation : *Ghost*

Soit tu le fais en freestyle, c'est à dire avec JavaScript, mais là je pourrais pas t'aider plus que ça

Ça sonne bien!!! ... mais comment?!!!

Citation : *Ghost*

EDIT : pourquoi tu fais 24 déclarations de variables ?
Tu fais un for qui crée ton tableau, ça t'économisera bien des lignes/des variables/du temps...

Les 24 déclaration parce que l'idée de faire une boucle for m'a fait peur bon je débute avec la programmation php et je ne connait pas toutes les astuces.

****************** herudo ******************************************

</span>

Citation

Salut!

Alors, je ne sais pas comment tu construit ton formulaire ou que tu récupère tes données, mais moi quand j'ai un formulaire à nombre d champs variable je procède comme ceci:

<?php
//#### Pour le formulaire
//pour 3 champs:
$nbChamps = 3;
for($i=0; $i<$nbChamps; $i++)
  echo '<input type="text" name="date_entree['.$i.']"/>

echo '<input type="hidden" name="nbChamps" value="'.$nbChamps.'"/>

//#### Pour le traitement
//on récupère en premier le nombre de champs
$nbChamps = $_POST['nbChamps'];

//récupération des autres champs et stockage des valeur dans un tableau
for($i=0; $i<$nbChamps; $i++)
   $date_entree[$i] = $_POST['date_entree[$i]'];

//traitement des données
?>

J'espère t'avoir aidé!

Merci pour le code!! Oui, vous m'avez bien aidé



Je crois qu'il y a quelques fautes dans le code que j'ai rectifié ... voilà un code qui tourne, si l'un des membres aurait besoin

#fichier: tab.php


<form action="tabAction.php">
<?php
//#### Pour le formulaire
//pour 3 champs:



$nbChamps = 3;
for($i=0; $i<$nbChamps; $i++) 
  echo "<input type='text' name='date_entree[".$i."]'/>";

	echo "<input type='hidden' name='nbChamps' value='".$nbChamps."'/>";

?>

<input type="submit" name="button"  value="Enregistrer" />

</form>



#Fichier: tabAction.php

<?php
//#### Pour le traitement
//on récupère en premier le nombre de champs
$nbChamps = $_GET['nbChamps'];

//récupération des autres champs et stockage des valeur dans un tableau
for($i=0; $i<$nbChamps; $i++)
  { //$date_entree[$i] = $_GET['date_entree['.$i.']'];
	echo $date_entree[$i] = $_GET['date_entree'][$i];
	echo "<br/>";
	}
		
//traitement des données

echo'<pre>';
	print_r($_GET);
echo'<pre>';
?>

*************** gyom *************************************

Citation

window.onload = function() {
	document.getElementById('addLine').onclick = function() {
		var inputs = document.getElementById('inputs');
		
		var input_text = document.createElement('input');
		input_text.setAttribute('type', 'text');
		input_text.setAttribute('name', 'dates_debut[]');
		
		var br = document.createElement('br');
		
		inputs.appendChild(input_text);
		inputs.appendChild(br);
	};
};

Merci, c'est vraiment super ce code!!! Bon je l'ai adapter à mon problème et voilà ce que j'ai fait:

<script>
window.onload = function() {
	document.getElementById('addLine').onclick = function() {
	
		// id=inputs
		var inputs = document.getElementById('inputs');
		
                //tableau qui contient les différents valeurs de l'attribut "name"
                var inputsNames= new Array ("date_debut[]","date_fin[]","lpd[]","dp[]","pc[]","ai[]");
		

		for (Val in inputsNames)
		{var input_text = document.createElement('input');
		input_text.setAttribute('style','width:100px');
		input_text.setAttribute('type', 'text');
		var nom=inputsNames[Val]; // Récuperation des données du tableau
		input_text.setAttribute('name', nom);
		//Cet attribut pour datepicker de JQuery mais malheureusement ca ne fonctionne pas! et je ne sais pourquoi?!!
                input_text.setAttribute('class', 'datepicker');

		inputs.appendChild(input_text);
		}
		
		
		
		//Retour à la ligne:
		var br = document.createElement('br');	
		inputs.appendChild(br);
	};

	
};
</script>

Le formulaire HTML:

<form method="get" action="tabScriptAction.php" >
    <div id="inputs">
    	<input style="width:100px" type="text" name="date_debut[]" class="datepicker" />
		<input style="width:100px" type="text" name="date_fin[]" class="datepicker" />
		<input style="width:70px" type="text" name="lpd[]" />
		<input style="width:70px" type="text" name="dp[]" />
		<input style="width:70px" type="text" name="pc[]" />
		<input style="width:70px" type="text" name="ai[]" /><br />
		
    </div>
	
	
    <input type="button" id="addLine" value="Ajouter une ligne" />
	<input type="button" id="deleteLine" value="Supprimer une ligne" />
	<br/><input type="submit" />
	
</form>

Merci.

Pour ce qui est du datepicker, il faut que tu refasse appel a la fonction d'initialisation du datepicker sur un champ dans ta fonction d'ajout de ligne.
Je pense que ça reglera aussi ton problème de style .

Alors pour ton bouton supprimer ligne tu veux fonctionner comment?
Suprimer la dernière ligne?
Ne serait peut etre pas plus joli de mettre un bouton supprimer la ligne dans chaque ligne ou une petite image?
Peut etre devrait tu poser ces nouvelles question dans le forum javascript

Alors moi j'ai fait ça (toujours sur la base du form que j'avais fait, donc va falloir adapter) :

Le HTML :

<form method="post" action="" >
    <div id="inputs">
    	<input type="text" style="width: 200px" name="dates_debut[]" /><br />
    </div>
    <input type="button" id="addLine" value="Ajouter une ligne" /><input type="button" id="delLine" value="Supprimer une ligne" /><br />
    <input type="submit" />
</form>

Le JS :

var lines_added = 0; /* Permet de vérifier qu'on ne supprime pas tout */

window.onload = function() {
	document.getElementById('addLine').onclick = function() {
		appendFormLine('inputs', 'dates_debut[]');
		lines_added++; /* On signale qu'on a ajouté une ligne */
	};
	document.getElementById('delLine').onclick = function() {
		if(lines_added > 0) {
			removeLastFormLine('inputs');
			lines_added--; /* On signale qu'on a retiré une ligne */
		}
	};
};

function appendFormLine(idCible, name) {
	var cible = document.getElementById(idCible);
	var br = document.createElement('br');
	var input_text = document.createElement('input');
	input_text.setAttribute('type', 'text');
	input_text.setAttribute('name', name);
	input_text.setAttribute('style', 'width: 200px;');
	cible.appendChild(input_text);
	cible.appendChild(br);
}

function removeLastFormLine(idCible) {
	var cible = document.getElementById(idCible);
	cible.removeChild(cible.lastChild); /* Suppression du <br /> */
	cible.removeChild(cible.lastChild); /* Suppression du <input /> */
}

Et ça fonctionne, même le width.

PS : Peut-être devrais-tu utiliser la fonction "Alerter un modérateur" pour demander un déplacement du topic vers le forum JavaScript ?