Outil de création de formulaire

26 janv. 2015, 16:25

Bonjour à tous, mon titre n'est peut être pas évocateur comme ça donc laissez moi vous expliquez.
Je travaille sur le moyen de créer un outil qui va générer le formulaire comme le désire le client. C'est à dire que je n'aurai pas à lui créer.
Donc ce qu'il me faut c'est une page avec un premier champ où je lui donne un nom et son type (pour un select, il faudra aussi créer ses différents options), je valide ce premier champ et je vais avoir un nouveau champ qui va apparaître.
Tant que je n'ai pas fini mon formulaire, je peux rajouter autant de champs que je le désire puis une fois que j'ai fini ce formulaire, je n'ai plus qu'à l'enregistrer dans ma base de données.
A ce stade, le formulaire crée est vide, je ne vais avoir que la structure du formulaire.

Je viens donc sur ce forum pour vous demander de l'aide concernant ce que je vous ai exposé.
Je continue de chercher de mon coté.
Merci d'avance.

Cordialement.

PS: j'avais commencé à utiliser PFBC mais n'ayant pas trouvé beaucoup de docs, j'ai préféré abandonné.

26 janv. 2015, 16:51

Bonjour,

Que cherches-tu exactement ?
Tu veux développer ce script, tu cherches une solution toute faite clé-en-main ?

Si tu veux le faire toi-même, il faut que tu nous dises sur quoi tu bloques, quels sont les messages d'erreur rencontrés, etc...

Si tu cherches des solutions clé-en-main, regarde du côté des plug-in pour les principaux CMS (Wordpress, Drupal...), voila un exemple :
https://wordpress.org/plugins/visual-fo ... reenshots/

26 janv. 2015, 17:11

Bonjour et merci de ta réponse. Je cherche plus à créer moi même cet outil.
En fait, j'aimerai faire quelque chose comme ça : http://www.webdevservices.net/fr/assistant/page1.php
Et en plus il faudrait que je puisse enregistrer le nom de mes champs ainsi que leur type dans une base de données.
Et mon premier blocage va être au niveau du bouton "+".
Je n'ai pas encore regardé du coté d' AJAX mais apparemment il fait ce genre de chose.
La création d'un formulaire et de l'enregistrement de ses données dans une BDD ne me chiffonne pas.
J'espère avoir été assez clair.

Merci.

27 janv. 2015, 09:43

Bjr,
Ajouter ou retirer un champ ca passe soit par du javascript soit par du php, ce dont tu te doutais:
Je saurais faire en PHP, mais c'est assez lourdingue.
j'ai trouvé ca en garglelisant : javascript form creating:
http://www.trans4mind.com/personal_deve ... ically.htm
dont j'ignore ce que ça vaut.

27 janv. 2015, 16:09

Bjr,
Ajouter ou retirer un champ ca passe soit par du javascript soit par du php, ce dont tu te doutais:
Je saurais faire en PHP, mais c'est assez lourdingue.
j'ai trouvé ca en garglelisant : javascript form creating:
http://www.trans4mind.com/personal_deve ... ically.htm
dont j'ignore ce que ça vaut.

Oublie ce tutorial qui a l'air issue de la préhistoire du web

27 janv. 2015, 17:49

Bonjour, tout d'abord merci à tous pour vos réponses.
Je reviens vers vous car j'ai trouvé un début de fonction qui me permet de créer un formulaire champ par champ.

Code : Tout sélectionner

<html>
<head>
<title>Ajout Supression de formulaire</title>
<script language="javascript">
<!--
function create_champ()
{
var i = parseInt(document.getElementById('nombre').value)
var i = i + 1;
if(i<'4'){
document.getElementById('nombre').value = i;
document.getElementById('zone_dynamique').innerHTML += '<div align="left" id="champ_"'+i+'>Formulaire  '+i+' :<input type="text" name="Produit_'+i+'">Select '+i+' :<select name=" select_'+i+'><option value="option '+i+'" selected>Selectionner...</option><option value name="Coucou"></option></select><input name="suppr" type="button"  onClick="javascript:supprime_champ()" value="Supprimer un champ"></div>';
}
else{
alert('Vous avez atteint le nombre maximum de ligne');
exit();
}

}
function supprime_champ(){
	var cpt = parseInt(document.getElementById('nombre').value);
	cpt--;
	var parent = document.getElementById('zone_dynamique');
	var NodeListe = parent.getElementsByTagName("div"); 

	
	if( NodeListe.length >= 2 ){
		var Enfant=NodeListe[NodeListe.length-1]
		parent.removeChild(Enfant);
		document.getElementById('nombre').value = cpt
	}		
	
	
}


-->
</script>
</head>
<body>

<form name="toto">
Nombre de champs : <input name="nombre" id="nombre" type="text" value="1" size="3">

  <div id="zone_dynamique">
    <div align="left"> Formulaire 1 :
      <input name="Produit_1" type="text"/>
      Select 1 :
      <select name="select_1" class="type" size="1" onChange="javascript:if(this.selectedIndex==3 || this.selectedIndex==4 || this.selectedIndex==5){document.getElementById('showParam1').style.visibility='visible';}
		if(this.selectedIndex==0 || this.selectedIndex==1 || this.selectedIndex==2 || this.selectedIndex==6 || this.selectedIndex==7){document.getElementById('showParam1').style.visibility='hidden';}">
      	<option value="" selected>Sélectionner...</option>
		<option value="champ_texte">Champ de texte</option>
        <option value="zone_email">Zone d'adresse e-mail</option>
        <option value="liste">Liste déroulante</option>
        <option value="bouton">Boutons radio</option>
        <option value="case">Cases à cocher</option>
        <option value="zone_texte">Zone de texte</option>

      </select>
    </div>
  </div>
  
  <br />
  <div align="left" id="input_2"> 
    <input name="button" type="button" class="input2" onClick="javascript:create_champ()" value="Ins&eacute;rer un autre champ">
</div>
</form>
</body>
</html>

Avec ça j'ai pu avoir un champ texte pour le nom du champ du formulaire ainsi que son type (via un select) mais voilà, j'aimerai récupérer les valeurs des types (ex: Textbox, Textarea, Select, Checkbox...) pour que la personne qui crée son formulaire puisse choisir le type. Et donc j'aimerai récupérer ces variables depuis ma BDD.
Déjà si je pouvais réussir ça, je serai content.

Merci encore.

Cordialement,

Jean Baptiste Borie

Outil de création de formulaire

Qui est en ligne