Afficher les �l�ments d'un form un par un

**xoxo27** · 04/04/2014, 11h56

Bonjour,

Je vous explique mon interrogation.
J'ai un formulaire fonctionnel mais je voudrais l'optimiser pour des questions de pr�sentation.

Enfet, je voudrais que :
D�s que l'utilisateur � s�lectionn� un �l�ment dans le select, cela soit reconnu, j'enregistre ma variable puis je cache le select et en affiche un autre � la place, mais sur la m�me page.
Je r�p�terais l'op�ration en tout 4 fois.

Mes interrogations sont donc:
Puis-je le faire de fa�on dynamique, sans appuis sur un bouton submit?
Dois je faire autant de formulaires que de "changement de select"?
Quelle est la meilleure m�thode � utiliser?

�a peut paraitre anodin comme �a mais j'avoue me prendre pas mal la t�te, j'ai pourtant de bonne bases en php

J'ai fais un formulaire de test pour bien saisir la technique :

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
 
<head>
 
<title>Test de propriété "Visible/invisible"</title>
 
 
 
<script language="JavaScript">
 
 
 
var ns4=document.layers
 
var ie4=document.all
 
var ns6=document.getElementById&&!document.all
 
 
 
function Affiche_Cache(nObjet) {
 
 if(ie4) { // Internet explorer
 
   eval(nObjet).style.visibility = 
 
    (eval(nObjet).style.visibility=='visible'?'hidden':'visible');
 
 }
 
 else if(ns4) { // Netscape 4.x
 
   document.eval(nObjet).visibility = 
 
    (document.eval(nObjet).visibility=='show'?'hidden':'show');
 
	}
 
 else if(ns6) { // Netscape 6 (mozilla)
 
   var divns6 = document.getElementsByTagName("div")
 
   divns6[nObjet].style.visibility = 
 
    (divns6[nObjet].style.visibility=='visible'?'hidden':'visible');
 
 }
 
}
 
</script>
 
</head>
 
<?php $t1=$_POST["select1"];?>
<form name="test">
 
Bonjour 
<select name="select1">
<option disabled='disabled' selected='selected' >Selectionner</option>
<option value = "1">Coucou</option>
<option value = "2">Bonjour</option>
</select>
 
Au revoir
<select name="select2" style="visibility:hidden" >
<option disabled='disabled' selected='selected' >Selectionner</option>
<option value = "1">salut</option>
<option value = "2">a plus</option>
</select>
<input type="submit" name="ok1" value="valider" />
</form>

Pour �tre plus clair si je ne le suis pas : D�s que l'utilisateur � s�lectionn� "Coucou" ou "Bonjour", je cache le select et affiche l'autre � la place ainsi de suite jusqu'� l'envoi de mes donn�es dans la BDD.

**NoSmoking** · 05/04/2014, 00h20

Bonjour,
rien que cette ligne devrait t�inciter � trouver, ou � cr�er, un autre script...

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all

D�s que l'utilisateur � s�lectionn� un �l�ment dans le select, cela soit reconnu, j'enregistre ma variable puis je cache le select et en affiche un autre � la place, mais sur la m�me page.

ergonomiquement parlant je ne trouve pas cela tr�s judicieux, mais peut �tre n'ai je pas compris la finalit�.

Pour essayer de r�pondre � la question il te faut regarder du cot� de l'�v�nement onchange des SELECTs, � voir pour le principe Comment lier deux listes d�roulantes entre elles ?

**xoxo27** · 07/04/2014, 12h11

Merci, ta r�ponse ma guid�e, cela fonctionne avec un autre script,

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
function showhide(divid){
	var nomComDiv=document.getElementById("nomComDiv");
  var com = document.getElementById("selectCom");
 
  if(com != "" ) {
    nomComDiv.style.display = 'none';
	ancDiv.style.display = 'block';
 
  }

Mon seul probl�me maintenant est que l'�l�ment ne remplace pas l'autre, du coup l'un disparait et l'autre apparait, cependant il laisse un espace vide et c'est pas tr�s joli

**NoSmoking** · 07/04/2014, 15h55

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
  var com = document.getElementById("selectCom");
 
  if(com != "" ) {

est ce que tu comprends ce que tu �cris l� ?

Afficher les �l�ments d'un form un par un

JavaScript

Vue hybride

Discussions similaires

Partager

Partager