Récupération paramètre get javascript

**christ8phe** · 21/02/2011, 17h41

Bonjour à tous,

débutant en javascript, voilà plusieurs heures que je cherche une solution à mon problème.

J'ai une page php ou je fais apparaître / disparaître des div en javascript donc de la façon suivante :

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
window.onload = function()
{
	for(var i=1; i<10; i++)
	{
		var id = 'tableau' + i;
		document.getElementById(id).style.display = "none";
	}
	alert(test);
 
}
 
function switchDiv(n)
{
    // Identifiant du bloc à traiter
    var id = 'tableau' + n;
    // Récupération du statut courant
    var sc = document.getElementById(id).style.display;
    // Définition du nouveau statut
    var ns = (sc == 'block') ? 'none' : 'block';
	//on cache tout sauf le séléctioné 
	for(var i=1; i<10; i++)
	{
		var id2 = 'tableau' + i;
		if (id != id2)
		document.getElementById(id2).style.display = "none";
		document.getElementById(id).style.display = ns;
	}
}
-->

Et je souhaiterais pouvoir faire afficher une div en arrivant d'une autre page ou j'aurais cliqué sur un lien.

d'après ce que j'ai compris le meilleur moyen serais de procédé de la sorte :

Code :

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

http://www.monsite/mapage.php?inter=tableau2

Et c'est là que j'appel à l'aide, comment récupéré cette valeur en javascript ?

J'ai parcouru des dizaine et dizaine de forum et je tombe à chaque fois sur des réponse différente que je n'arrive pas à mettre en place.

D'avance merci à tous.

**Bovino** · 21/02/2011, 17h59

Envoyé par christ8phe

J'ai parcouru des dizaine et dizaine de forum

Pas la

apparemment

Comment récupérer les paramètres passés dans une url ?

**andry.aime** · 21/02/2011, 18h04

Bonsoir,

Mais si tu veux récupérer la page et le mettre dans un div, regarde du coté AJAX.

A+.

**christ8phe** · 21/02/2011, 18h21

Effectivement je ne penser pas que la faq contiendrais ce genre d'information,
de plus j'étais déjà tomber sur un code similaire mais qui n'étais pas complet et vu que je suis pas trop js.

Encore merci !

**christ8phe** · 02/03/2011, 14h40

Re bonjour,

Voici mon js :

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
<!--
window.onload = function()
{
	for(var i=1; i<6; i++)
	{
		var idi = 'bouton' + i;
		document.getElementById(idi).style.display = "none";
	}
 
 
	for(var i=1; i<28; i++)
	{
		var id = 'tableau' + i;
		document.getElementById(id).style.display = "none";
	}
 
 
	var nom=new Array();
    var valeur=new Array();
 
    // On enlève le ?
    param = window.location.search.slice(1,window.location.search.length);
 
    // On sépare le paramètres....
    // first[0] est de la forme param=valeur
 
    first = param.split("&");
 
    for(i=0;i<first.length;i++){
        second = first[i].split("=");
        nom[i] = second[0];
        valeur[i] = second[1];
    }
	if (nom){
		document.getElementById(valeur).style.display = "block";
	}
}
 
 
function switchDiv(n)
{
    // Identifiant du bloc à traiter
    var id = 'tableau' + n;
    // Récupération du statut courant
    var sc = document.getElementById(id).style.display;
    // Définition du nouveau statut
    var ns = (sc == 'block') ? 'none' : 'block';
	//on cache tout sauf le séléctioné 
	for(var i=1; i<32; i++)
	{
		var id2 = 'tableau' + i;
		if (id != id2)
		document.getElementById(id2).style.display = "none";
		document.getElementById(id).style.display = ns;
	}
}
 
 
function switchDivTwo(n)
{
    // Identifiant du bloc à traiter
    var id = 'bouton' + n;
    // Récupération du statut courant
    var sc = document.getElementById(id).style.display;
    // Définition du nouveau statut
    var ns = (sc == 'block') ? 'none' : 'block';
	//on cache tout sauf le séléctioné 
	for(var i=1; i<6; i++)
	{
		var id2 = 'bouton' + i;
		if (id != id2)
		document.getElementById(id2).style.display = "none";
		document.getElementById(id).style.display = ns;
	}
}
-->

Et si j'ai comme adresse :

Code :

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

http://www.monsite.fr/test.php?inter=bouton1&inter2=tableau1

Comment je peut m'y prendre si je veux récupéré les deux ?

**NoSmoking** · 02/03/2011, 20h23

Envoyé par christ8phe

Et si j'ai comme adresse :

Code :

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

http://www.monsite.fr/test.php?inter=bouton1&inter2=tableau1

Comment je peut m'y prendre si je veux récupéré les deux ?

mais tu récupères les deux si je ne m'abuse

**christ8phe** · 04/03/2011, 08h15

Re coucou,

merci NoSmoking.

Alors voilà j'ai tous ce qu'il me faut niveau javascript pour faire fonctioner ma page, ça donne :

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
<!--
window.onload = function()
{
	for(var i=1; i<6; i++)
	{
		var idi = 'famille' + i;
		document.getElementById(idi).style.display = "none";
	}
 
 
	for(var i=1; i<30; i++)
	{
		var id = 'tableau' + i;
		document.getElementById(id).style.display = "none";
	}
 
 
	var nom=new Array();
    var valeur=new Array();
 
    // On enlève le ?
    param = window.location.search.slice(1,window.location.search.length);
 
    // On sépare le paramètres....
    // first[0] est de la forme param=valeur
 
    first = param.split("&");
 
    for(i=0;i<first.length;i++){
        second = first[i].split("=");
        nom[i] = second[0];
        valeur[i] = second[1];
    }
	if (nom){
		document.getElementById(valeur).style.display = "block";
	}
}
 
 
function switchDiv(n)
{
    // Identifiant du bloc à traiter
    var id = 'tableau' + n;
    // Récupération du statut courant
    var sc = document.getElementById(id).style.display;
    // Définition du nouveau statut
    var ns = (sc == 'block') ? 'none' : 'block';
	//on cache tout sauf le séléctioné 
	for(var i=1; i<30; i++)
	{
		var id2 = 'tableau' + i;
		if (id != id2)
		document.getElementById(id2).style.display = "none";
		document.getElementById(id).style.display = ns;
	}
}
 
 
function switchDivTwo(n)
{
		for(var i=1; i<30; i++)
	{
		var id = 'tableau' + i;
		document.getElementById(id).style.display = "none";
	}
    // Identifiant du bloc à traiter
    var id = 'famille' + n;
    // Récupération du statut courant
    var sc = document.getElementById(id).style.display;
    // Définition du nouveau statut
    var ns = (sc == 'block') ? 'none' : 'block';
	//on cache tout sauf le séléctioné 
	for(var i=1; i<6; i++)
	{
		var id2 = 'famille' + i;
		if (id != id2)
		document.getElementById(id2).style.display = "none";
		document.getElementById(id).style.display = ns;
	}
}
-->

Mais je suis un peut maniac du code et j'aime quand c'est bien rangé, donc pour arranger tout ça, que puis-je faire ?

Pour commencer j'avais penser à trouver une solution au niveau de mes boucle.

Est il possible de remplacer un nombre d’élément définit (i<30) par une boucle qui évaluerais automatiquement le nombre d'id à traiter ?

de cette manière si j’ajoute des id au fil du temps je n'aurais pas à revenir changer cette valeur à chaque fois et je pourrais allégé mon code.

Merci

**NoSmoking** · 04/03/2011, 10h45

Envoyé par christ8phe

Est il possible de remplacer un nombre d’élément définit (i<30) par une boucle qui évaluerais automatiquement le nombre d'id à traiter ?

de cette manière si j’ajoute des id au fil du temps je n'aurais pas à revenir changer cette valeur à chaque fois et je pourrais allégé mon code.

de la façon dont tu procèdes au niveau de l'identification de tes élément tu peux tout à fait concevoir ce genre de boucles

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
// variables
var oElem,
    i = 1,
    sId = "famille";
// traite les familles      
while(( oElem = document.getElementById( sId +i))){
  oElem.style.display = "none";
  i++;
}
// traite les tableaux
i = 1;
sId = "tableau";
while(( oElem = document.getElementById( sId +i))){
  oElem.style.display = "none";
  i++;
}

avec moyen de factoriser tout cela

Code :

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

1
2
3
4
5
6
7
8
9
function masqueAll( deb, id){
  var oElem,
      i = deb,
      sId = id;
  while(( oElem = document.getElementById( sId +i))){
    oElem.style.display = "none";
    i++;
  }    
}

il ne te reste plus qu'à faire des appels du type

Code :

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

1
2
masqueAll( 1, 'famille');
masqueAll( 1, 'tableaux');

à la place de tes 2 boucles for

Envoyé par christ8phe

Mais je suis un peut maniac du code et j'aime quand c'est bien rangé

- ne pas déclarer de variables dans les boucles

- déclarer TOUTES les variables locales avec le mot clé var, il en manque dans ton code

- mettre de l'indentation et les accolades SYSTEMATIQUEMENT dans les conditions

Code :

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

1
2
3
if (id != id2)
document.getElementById(id2).style.display = "none";
document.getElementById(id).style.display = ns;

ce code est difficilement lisible, est ce que tu veux 32 fois afficher/masquer l'élément ou le faire uniquement quand id != d2. Cela rend difficile la maintenance...

- ne pas dupliquer les fonctions mais les factoriser, dés que l'on écrit 2 fois la même chose, il est utile de ce poser la question ou de se faire la remarque "Et si je passais des paramètres à la fonction !!!"c'est visiblement le cas pour tes fontions switchDiv et switchDivTwo.

**christ8phe** · 04/03/2011, 12h10

Ouaou merci, je vais regardé tous cela attentivement.

Sinon pour répondre à ta question quant on sélection un switchdivtwo je veux masqué tous les tableau et afficher seulement la famille sélectionné.

quand je clic sur le switchdiv je veux affiché uniquement le tableau caché les autre mais conservé la famille ouverte.

En simplifié :

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
<a onclick="switchDivTwo(1)">....<a onclick="switchDivTwo(6)">
<famille1>
   <a onclick="switchDiv(1)">....<a onclick="switchDiv(12)">
   <tableau1></tableau1>
   <tableau2></tableau2>
   .....
   <tableau12></tableau12>
</famille>
 
<famille2>
   <a onclick="switchDiv(13)">....<a onclick="switchDiv(21)">
   <tableau13></tableau13>
   <tableau14></tableau14>
   .....
   <tableau21></tableau21>
</famille>

**christ8phe** · 08/03/2011, 19h35

Bon ben du coup, vu le nombre de tableau j'ai supprimé :

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
// variables
var oElem,
    i = 1,
    sId = "famille";
// traite les familles      
while(( oElem = document.getElementById( sId +i))){
  oElem.style.display = "none";
  i++;
}
// traite les tableaux
i = 1;
sId = "tableau";
while(( oElem = document.getElementById( sId +i))){
  oElem.style.display = "none";
  i++;
}

Au démarrage de ma page et j'ai mis directement un style.display.none à mes div car au chargement c'étais pas beau et trop long. et tampis pour ceux qui n'on pas js !

**NoSmoking** · 09/03/2011, 13h17

une autre solution à regarder, éventuellement, est d'encapsuler tes tables dans un même conteneur et de faire afficher/masquer le conteneur.

Récupération paramètre get javascript

JavaScript

Discussions similaires

Partager

Partager