Récupération paramètre get javascript [Résolu]

[christ8phe]

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 :

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 :

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]

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]

Bonsoir,

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

A+.

[christ8phe]

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]

Re bonjour,

Voici mon js :

Code :

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 :

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]

Envoyé par christ8phe

Et si j'ai comme adresse :

Code :

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]

Re coucou,

merci NoSmoking.

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

Code :

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]

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 :

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 :

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 :

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 :

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]

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 :

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]

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

Code :

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]

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