Discussion :

[Fredy007]

Bonjour,

J'ai un formulaire qui contient plusieurs catégories, chaque catégorie contient des champs, on peut trouver des champs qui se répètent sur plusieurs catégories, avec le menu déroulant, on choisit la catégorie, et comme ça les champs se génère automatiquement, j'ai utilisé la méthode de show / hide, mais je dois mettre tous les champs dans la même page, y a t il une méthode facile qui peut m'aider à générer les champs soit disant par json ou autres?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
+ Catégorie1
-- Champs1
-- Champs2
-- Champs5
 
 
+ Catégorie2
-- Champs1 // voici un champs qui se répète
-- Champs3
 
+ Catégorie3
-- Champs1 // voici un champs qui se répète
-- Champs3 // voici un champs qui se répète
-- Champs6

EDIT

Par exemple, le formulaire est vide, il contient seulement un menu déroulant des catégories:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<select name="cats" id="catsID">
<option value="cat1">Catégorie1</option>
<option value="cat2">Catégorie2</option>
<option value="cat3">Catégorie3</option>
</select>

Je choisi du menu déroulant, Catégorie1, je devais avoir quelque chose comme:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<select name="cats" id="catsID">
<option value="cat1">Catégorie1</option>
<option value="cat2">Catégorie2</option>
<option value="cat3">Catégorie3</option>
</select>
 
<input type="text" name="name">
<br>
<input type="text" name="username">
<br>
<input type="password" name="password">
<br>

ainsi de suite

Merci à vous

[bonjourajax]

Salut,

Si tu ne veux pas ecrire le code du menu déroulant dans ta page, tu peux l'écrire dans une autre page et charger le contenu de cette page dans ton menu lors du clic

Regade cette méthode :
http://api.jquery.com/load/

Ou faire un script qui remplit le contenu de ton menu déroulant, lors du clic

[Fredy007]

Je pense avec la méthode "load", on ne peut pas effectuer des controles jQuery

[bonjourajax]

Donne nous plus d'informations sur ta demande

[Fredy007]

Bonjour bonjourajax, J'ai édité mon message

[bonjourajax]

Bonjour Fredy007,

Pour gérer le choix de ta catégorie :

Dans ta page html

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
<select name="cats" id="catsID">
<option value="cat1">Catégorie1</option>
<option value="cat2">Catégorie2</option>
<option value="cat3">Catégorie3</option>
</select>
 
<div id="div">
</div>

Ceci te permet d'agir en fonction de la catégorie choisie :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<script>
 
$('select').change(function() {
 
   $valcategorie = $(this).val();
 
   if($valcategorie == 'cat1') {
         $('#div').load(' ... '); // avec load tu peux mettre le contenu d'une autre div
   }
});
 
 
</script>

[Fredy007]

Lorsque la page est appelée avec load, quand je veux mettre des contrôles jQuery, ça marche pas, parce que le contenu est venu d'une autre page, alors j'ai fait un petit effort afin de mieux vous expliquer DEMO

Tout en sélectionnant catégorie1, le formulaire de catégorie1 apparaissait, ainsi de suite pour catégorie2,...

[bonjourajax]

Tu peux intéragir avec le contenu chargé par load
Donne des id aux éléments de ton autre page et tu peux toujours faire des contrôles

[Fredy007]

J'ai résolu le problème avec load, je charge les champs, j'avais un problème de contrôle des champs chargé, au lieu de mettre 'click' sur un id, j'ai mis:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
$(document).on('click', '#id', function(){
// code
});

au lieu de:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
$('#id').on('click', function(){
// code
});

merci bonjourajax