IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[Javascript] Ajouter/supprimer option d'un formulaire


Sujet :

JavaScript

  1. #1
    Membre régulier
    Profil pro
    Inscrit en
    Mars 2006
    Messages
    124
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2006
    Messages : 124
    Points : 77
    Points
    77
    Par défaut [Javascript] Ajouter/supprimer option d'un formulaire
    Bonjour,

    Je dois reprendre un formulaire avec plusieurs critères.
    Pour certains blocs de critère (liste multiple, boîte à cocher, bouton radio ...), l'utilisateur a la possibilité en cliquant sur un lien d'ajouter un bloc identique autant de fois qu'il le veut, et de pouvoir les enlever avec un lien en face de chacun des bloc ajouté. Donc un + est affiché en face du premier bloc et un - en face des autres.
    Le problème c'est que j'ai essayé de le faire sans retoucher tout le code mais rien ne marche correctement.
    Donc si quelqu'un a une idée à me proposer, une manière de faire ou quelque chose ce serait sympa.
    Merci d'avance.

  2. #2
    Membre régulier
    Profil pro
    Inscrit en
    Mars 2006
    Messages
    124
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2006
    Messages : 124
    Points : 77
    Points
    77
    Par défaut
    Je voulais en faire le moins possible mais faut pas rêver.
    Si je veux réécrire tout mon bloc, est ce qu'une syntaxe comme ça marcherai ?
    Je demande car c'est un bloc très gros à faire et si la syntaxe ne marche pas c'est pas la peine que je paluche tout à taper.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
     
    		var divParent = document.getElementById('nbdiv_mot_cle');
     
    		var nouveauDiv = document.createElement('div');
    		nouveauDiv.id = 'div_filtre_mot_cle'+nbdiv_mot_cle; // dans un hidden de nbdiv_mot_cle
    		nouveauDiv.style = 'border-width:1;color:red;';
     
    		var nouveauTable = document.createElement('table');
    		nouveauTable.class = 'cpcwidth';
     
    		var nouveauTr1 = document.createElement('tr');
    		nouveauTr1.valign = 'center';
     
    		var nouveauTd11 = document.createElement('td');
    		nouveauTd11.class = 'ligneinput';
    		nouveauTd11.valign = 'center';
    		nouveauTd11.width = '220';
    		nouveauTd11.cospan = '2';
     
    		var nouveauLabel1 = document.createElement('label');
    		nouveauLabel1.appendChild(document.createTextNode("Mot clé recherché : "));
     
    		var nouveauInputText1 = document.createElement('input');
    		nouveauInput.name = 'mot_rech_0';
    		nouveauInput.type = 'text';
    		nouveauInput.size = '27';
     
    		var nouveauInputBox1 = document.createElement('box');
    		nouveauInput.name = 'tous_sauf_0';
    		nouveauInput.type = 'checkbox';
    		nouveauInput.value = '1';		
     
    		var nouveauLabel2 = document.createElement('label');
    		nouveauLabel2.appendChild(document.createTextNode(" tous sauf"));
     
    		...
     
    		divParent.appendChild(nouveauDiv);
    		nouveauDiv.appendChild(nouveauTable);
    		nouveauDiv.appendChild(nouveauTr1);
    		nouveauDiv.appendChild(nouveauTd11);
    		nouveauDiv.appendChild(nouveauLabel11);
    		nouveauDiv.appendChild(nouveauInputText1);
    		nouveauDiv.appendChild(nouveauInputBox1);
    		nouveauDiv.appendChild(nouveauInputLabel2);
     
    		...
    Merci d'une petite réponse.

  3. #3
    Membre régulier
    Profil pro
    Inscrit en
    Mars 2006
    Messages
    124
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2006
    Messages : 124
    Points : 77
    Points
    77
    Par défaut
    Cette syntaxe marche, les attributs nowrap et colspan ne marche pas, à voir d'où vient le problème mais pour le reste c'est bon, je donne le code si ça intéresse quelqu'un (désolé pour l'indentation c'était pour me repérer) :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
     
    function add_f_mot_cle(id)
    	{
     
    		var nbdiv_mot_cle = document.enreg.nbdiv_mot_cle.value;
     
    		var divParent = document.getElementById('div_mot_cle0');
     
    		var nouveauDiv = document.createElement('div');
    		nouveauDiv.id = 'div_filtre_mot_cle'+nbdiv_mot_cle;
    		//nouveauDiv.style = 'border-width:1;color:red;';
     
    		var nouveauTable = document.createElement('table');
    		nouveauTable.className = 'cpcwidth';
     
    			var nouveauTr1 = document.createElement('tr');
    			nouveauTr1.valign = 'center';
     
    				var nouveauTd11 = document.createElement('td');
    				nouveauTd11.className = 'ligneinput';
    				nouveauTd11.valign = 'left';
    				nouveauTd11.width = '220';
    				nouveauTd11.nowrap = 'nowrap';
    				nouveauTd11.colspan = '2';
     
    					var nouveauLabel11 = document.createTextNode("Mot clé recherché : ");
     
    					var nouveauInputText1 = document.createElement('input');
    					nouveauInputText1.name = 'mot_rech_'+nbdiv_mot_cle;
    					nouveauInputText1.type = 'text';
    					nouveauInputText1.size = '27';
     
    					var nouveauInputBox1 = document.createElement('input');
    					nouveauInputBox1.name = 'tous_sauf_0';
    					nouveauInputBox1.type = 'checkbox';
    					nouveauInputBox1.value = '1';		
     
    					var nouveauLabel12 = document.createTextNode(" tous sauf");
     
    			var nouveauTr2 = document.createElement('tr');
    			nouveauTr2.valign = 'center';
     
    				var nouveauTd21 = document.createElement('td');
    				nouveauTd21.className = 'ligneinput';
     
    					var nouveauInputSelect1 = document.createElement('input');
    					nouveauInputSelect1.name = 'type_rech_'+nbdiv_mot_cle+'[]';
    					nouveauInputSelect1.type = 'select';
    					nouveauInputSelect1.size = '15';
    					nouveauInputSelect1.multiple = 'true';
    					//nouveauInputSelect1.style = 'width:350;';
     
    					// Création de la liste à partir du tableau php.
     
    					var nouveauLabel21 = document.createTextNode(' (-)');
     
    					var nouveauLien1 = document.createElement('a');
    					nouveauLien1.href = 'javascript:delLigne('+nbdiv_mot_cle+');';
    					//nouveauLien1.onclick = delLigne (nbdiv_mot_cle);
    					nouveauLien1.id = 'moins_'+nbdiv_mot_cle;
    					//nouveauLien1.onclick = 'delLigne('+nbdiv_mot_cle+'); return false;';
    					nouveauLien1.className = 'navigation';	
     
    				var nouveauTd22 = document.createElement('td');
    				nouveauTd22.className = 'txt';
    				nouveauTd22.align = 'left';
    				nouveauTd22.nowrap = 'nowrap';
     
    					var nouveauLabel22 = document.createTextNode(" Et ");
     
    					var nouveauInputRadio1 = document.createElement('input');
    					nouveauInputRadio1.name = 'concatenation_mot_cle_0';
    					nouveauInputRadio1.type = 'radio';
    					nouveauInputRadio1.checked = 'checked';
    					nouveauInputRadio1.value = 'AND';
     
    					var nouveauLabel23 = document.createTextNode(" Ou ");
     
    					var nouveauInputRadio2 = document.createElement('input');
    					nouveauInputRadio2.name = 'concatenation_mot_cle_0';
    					nouveauInputRadio2.type = 'radio';
    					nouveauInputRadio2.value = 'OR';		
     
    		nb_div_mot_cle = nb_div_mot_cle + 1;
    		document.enreg.nbdiv_mot_cle.value = nb_div_mot_cle;
     
    		divParent.appendChild(nouveauDiv);
    		nouveauDiv.appendChild(nouveauTable);
    			nouveauTable.appendChild(nouveauTr1);
    				nouveauTr1.appendChild(nouveauTd11);
    					nouveauTd11.appendChild(nouveauLabel11);
    					nouveauTd11.appendChild(nouveauInputText1);
    					nouveauTd11.appendChild(nouveauInputBox1);
    					nouveauTd11.appendChild(nouveauLabel12);
    			nouveauTable.appendChild(nouveauTr2);
    				nouveauTr2.appendChild(nouveauTd21);
    					nouveauTd11.appendChild(nouveauInputSelect1);
    					nouveauTd11.appendChild(nouveauLien1);
    						nouveauLien1.appendChild(nouveauLabel21);
    				nouveauTr2.appendChild(nouveauTd22);
    					nouveauTd11.appendChild(nouveauLabel22);
    					nouveauTd11.appendChild(nouveauInputRadio1);
    					nouveauTd11.appendChild(nouveauLabel23);
    					nouveauTd11.appendChild(nouveauInputRadio2);
     
    	}

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Ajouter:Supprimer contacts en Javascript
    Par pdtor dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 04/11/2008, 15h02
  2. ajouter et supprimer un champ de formulaire
    Par sativa808 dans le forum Général JavaScript
    Réponses: 7
    Dernier message: 17/07/2008, 19h32
  3. Réponses: 1
    Dernier message: 26/06/2008, 18h59
  4. Ajouter / supprimer plusieurs éléments dans un formulaire
    Par nesswaw dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 07/03/2008, 10h52
  5. [DOM] Ajouter/Supprimer un input à un formulaire
    Par merzhin dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 26/09/2006, 01h09

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo