Input dynamique

Bonjour tout le monde, je suis sur un projet de création d'une application web de facturation avec PHP MySql et je viens ici pour que vous que m'aidez sur un problème.

Je voudrais créer des champs de type 'select' avec un bouton qui permet d'ajouter une nouvelle ligne pour sélectionner une nouvelle valeur. Et de pouvoir insérer chaque ligne insérer dans ma base de données.

j'ai déjà une table qui contient tous les pièces automobiles. Et une table facture qui peut contenir plusieurs pièces automobiles.

Explication: dans une facture on peut avoir plusieurs pièces automobiles et une pièce automobile peut être dans un ou plusieurs factures.

Bref: 1- Commentcréer des inputs dynamiques?

2- Comment récupérerinsérer ces valeurs dans la base?

Si vous avez un exemple de code vous pouvez le mettre.



Merci d'avance.

Bonjour kheus,

Voici un exemple que j'avais commencer pour un formulaire de contact et qui à une fonction comme celle que tu demande (c'est une ébauche non finit), je testé de faire une fonction comme celle que tu demande donc il n'y a que cette "fonction".
(Ne prend pas en compte les commentaires se trouvant dans le code, certains peuvent t'aider, d'autres sont juste des moyens que j'avais pour me rappeler ou faire tel chose.)

- Quand je l'avais commencé puis abandonné je me servais de JS / PHP donc il te faudra un fichier jquery :
* https://jquery.com/download/ Tu le téléchargeras ici (soit le compressé soit le non compressé.

Dans un fichier php tu met ceci dans l'ordre que je te donne:

Code pour implémenter le jquery (change le nom du fichier , j'avais une vieille version à ce moment):

<script type="text/javascript" src="jquery-3.2.1.min.js"></script>

Code PHP:

<?php if(isset($_POST["submit"])){
			if(isset($_POST['contactObj'])){
				if(isset($_POST['contactObj'], $_POST['contactObjA']) && $_POST['contactObj'] == "Autre"){
					/** Si le select(categ/ <select>) est sélectionner sur Autre alors le post du select de categ seras le input contactObjA */
					$CPostObj = $_POST['contactObjA'];
				}
				if($_POST['contactObj'] == "00"){
					/** Si le select(categ/ <select>) n'est pas sélectionner , sa valeur seras 0 donc Erreur*/
					$CPostObj = "";
					$ErrorOrSucc = "Veuillez choisir une catégorie (objet de demande de contact).";
				}elseif($_POST['contactObj'] == "1"){
					/** Si le select(categ/ <select>) est sélectionner est a une valeur autres que 0 alors pas d'erreur*/
					$CPostObj = "1";
				}elseif($_POST['contactObj'] == "2"){
					$CPostObj = "2";
				}elseif($_POST['contactObj'] == "3"){
					$CPostObj = "3";
				}elseif($_POST['contactObj'] == "4"){
					$CPostObj = "4";
				}elseif($_POST['contactObj'] == "5"){
					$CPostObj = "5";
				}elseif($_POST['contactObj'] == "6"){
					$CPostObj = "6";
				}elseif($_POST['contactObj'] == "7"){
					$CPostObj = "7";
				}elseif($_POST['contactObj'] == "8"){
					$CPostObj = "8";
				}elseif($_POST['contactObj'] == "9"){
					$CPostObj = "9";
				}elseif($_POST['contactObj'] == "10"){
					$CPostObj = "10";
				}elseif($_POST['contactObj'] == "Autre"){
					/** (Vérif à nouveau) Si le select(categ/ <select>) est sélectionner sur Autre alors le post du select de categ seras le input contactObjA */
					$CPostObj = $_POST['contactObjA'];
				}else{
					/** (Vérif à nouveau) Si le select(categ/ <select>) n'est pas sélectionner , sa valeur seras 0 donc Erreur*/
					$ErrorOrSucc = "Veuillez choisir une catégorie (objet de demande de contact).";
				}
				
				/** SQL à faire + vérif du reste du formulaire*/
				
				/** Commentaire utile pour toi:     ex de insert dans la BDD:
					$Requette = $baseO->prepare('INSERT INTO contact VALUES (:id, :aaa, :bbb, :ccc, :categorie)');
					$Requette->execute(array('id' => '', 'aaa' => '', 'bbb'=> '', 'ccc' => '', 'categorie' => $CPostObj));
					
					if($Requette){ 
						$ErrorOrSucc = '<div class="msg-success"><p>Formulaire de contact envoyé avec success.</p></div>';
						echo '<meta http-equiv="refresh" content="3">';
					}else{
						$ErrorOrSucc = '<div class="msg-error"><p>Le formulaire de contact n\'a pas été envoy\é.</p></div>';
					} **/
				
				
			}else{
				$CPostObj = "";
				$ErrorOrSucc = "Veuillez choisir une catégorie (objet de demande de contact).";
			}

		}else{
			$CPostObj = "";
		} ?>
		<?php if(isset($ErrorOrSucc)){ echo $ErrorOrSucc; } ?>

Code HTML (le Form):

<form class="ContactForm" name="formulaire" method="post">
			<legend>Objet de votre message:</legend>
			<div class="ObjMess">
				<label id="lab" class="objetl" for="contactObj">Objet :</label>
				<div class="select">
					<select name="contactObj" id="slct">
						<option value="00" disabled="disabled" selected="selected">Choisir un objet : </option>
						<option value="00" disabled="disabled"></option>
						<option value="1">Problème de Connexion.</option>
						<option value="2">Problème d' Inscription.</option>
						<option value="3">Problème d' Hébergeur.</option>
						<option value="4"></option>
						<option value="5"></option>
						<option value="6"></option>
						<option value="7"></option>
						<option value="8"></option>
						<option value="9"></option>
						<option value="10"></option>
						<option value="00" disabled="disabled"></option>
						<option value="Autre">Autre : </option>
					</select>
				</div>
			</div>
			<div id="v_Autre" class="d_autre" style="display:none">
				<input type="text" id="objet" name="contactObjA" placeholder="Objet de votre email" maxlength="120" value="<?php echo stripslashes($CPostObj); ?>" tabindex="3" />
			</div>
			<script type="text/javascript">
				$('select[name="contactObj"]').change(function(){
				    var id = "v_" + $(this).val();
				    $('div.d_autre').hide();
				    $('#'+id).show();
				});
			</script>
			<div style="text-align:center;">
				<input type="submit" id="submit" name="submit" value="Envoyer le formulaire !" />
			</div>
		</form>

Tu trouveras surement plus simple voir meilleur que celui la mais sa peut toujours aider ^^.
Modifié par thelm (02 Feb 2020 - 23:14)

Bonjour Thelm, merci ce code et les explications.
je vais l'essayer pour de voir.

merci encore.

Salut Thelm,
Ce n'est pas exactement ce que je voulais.
je veux permettre aux utilisateurs de dupliquer un input de types select s'il a besoin de rajouter une autre ligne pour cet input.
par exemple: dans la facture il ya 2 pièces automobiles qu'on doit mettre, donc l'utilisateur doit avoir deux input de select.
je ne sais si vous avez bien compris

Salut

Pour cela, il faut regarder .append() ou .before() pour créer du HTML à la volé.

Si tu dois "dupliquer" un select tu as également .clone()

$('select#options').clone().attr('id', 'newOptions').appendTo('.taclasse');

voir les manipulations