Menu javascript devrait rester ouvert..

Version imprimable

13/06/2006, 17h55
gregius

Menu javascript devrait rester ouvert..

Hello,

Je suis en train de cr�er un site avec un menu en javascript qui est d�veloppable c'est-� dire que quand on clique sur une rubrique, les autres rubriques descendent et les submenu apparaissent.
Le probl�me c'est que lorsque je clique sur un lien submenu, la page enti�re se recharge et le menu est � nouveau compl�tement ferm�...
C'est le cas en html et j'ai vu qu'en php c'est le m�me cas �tant donn� qu'il recharge �galemetn toute la page...
J'ai vu en cherchant qu'il faudrait utiliser AJAX... �a � l'air compliqu� et je me demandais si quelqu'un n'avait pas d�j� r�alis� un site o� l'en-t�te, le menu et le pied de page reste et qu'il n'y a que la partie centrale qui change?
MErci

Greg
14/06/2006, 00h35
Eric Berger

Tu n'auras pas forc�ment besoin d'ajax... Ajax te permettrait juste d'obtenir des informations du serveur sans recharger la page enti�re. Ce dont tu ne devrais pas avoir besoin si la quantit�s totale d'informations de ton menu n'est pas trop importante. Dans ce cas, une gestion dynamique du menu � l'aide de javaScript devrait �tre suffisante.

Citation:

Envoy� par Eric Berger

Tu n'auras pas forc�ment besoin d'ajax... Ajax te permettrait juste d'obtenir des informations du serveur sans recharger la page enti�re. Ce dont tu ne devrais pas avoir besoin si la quantit�s totale d'informations de ton menu n'est pas trop importante. Dans ce cas, une gestion dynamique du menu � l'aide de javaScript devrait �tre suffisante.

Il existe donc des menu javascript qui lorsqu'on clique sur un lien, rechargent la page et se souviennent de l'architecture?
J'ai ajout� mon code ci-dessous...
N'y connaissant rien � javascript... quelqu'un pourrait-il m'aider pour ajouter les lignes n�cessaires?

Un grand merci d'avance

Greg

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
82
83
84
 
if(!window.Node){
	var Node = {ELEMENT_NODE : 1, TEXT_NODE : 3};
}
function checkNode(node, filter){
	return (filter == null || node.nodeType == Node[filter] || node.nodeName.toUpperCase() == filter.toUpperCase());
}
function getChildren(node, filter){
	var result = new Array();
	var children = node.childNodes;
	for(var i = 0; i < children.length; i++){
		if(checkNode(children[i], filter)) result[result.length] = children[i];
	}
	return result;
}
function getChildrenByElement(node){
	return getChildren(node, "ELEMENT_NODE");
}
function getFirstChild(node, filter){
	var child;
	var children = node.childNodes;
	for(var i = 0; i < children.length; i++){
		child = children[i];
		if(checkNode(child, filter)) return child;
	}
	return null;
}
function getFirstChildByText(node){
	return getFirstChild(node, "TEXT_NODE");
}
function getNextSibling(node, filter){
	for(var sibling = node.nextSibling; sibling != null; sibling = sibling.nextSibling){
		if(checkNode(sibling, filter)) return sibling;
	}
	return null;
}
function getNextSiblingByElement(node){
	return getNextSibling(node, "ELEMENT_NODE");
}
 
var activeMenu = null;
 
function showMenu(){
	if(activeMenu){
		activeMenu.className = "";
		getNextSiblingByElement(activeMenu).style.display = "none";
	}
	if(this == activeMenu){
		activeMenu = null;
	}else{
		this.className = "active";
		getNextSiblingByElement(this).style.display = "block";
		activeMenu = this;
	}
	return false;
}
function initMenu(){
	var menus, menu, text, a, i;
	menus = getChildrenByElement(document.getElementById("menu"));
	for(i = 0; i < menus.length; i++){
		menu = menus[i];
		text = getFirstChildByText(menu);
		a = document.createElement("a");
		menu.replaceChild(a, text);
		a.appendChild(text);
		a.href = "#";
		a.onfocus = function(){this.blur()};
	}
}
if(document.createElement) window.onload = initMenu;
function MenuDisplay()
{
	document.write('<ul id="menu">');
		document.write('<li class="puce_noeud">Présentation');
		  document.write('<ol>');
		    document.write('<li class="puce_sous_cat"><a href=index.php?page=objectifs#>Missions et Objectifs</a></li>');
		    document.write('<li class="puce_sous_cat"><a href=index.php?page=accueil#>accueil</a></li>');
		  document.write('</ol>');
		  document.write('<div class="separateur"></div>');
		document.write('</li>');
 
 
	document.write('</ul>');
}

14/06/2006, 09h45
Eric Berger

Dans ce cas, Ajax ne sera pas plus efficace, si tu recharges une page, Ajax ne sera pas � m�me de maintenir l'�tat.

Citation:

Envoy� par gregius

N'y connaissant rien � javascript... quelqu'un pourrait-il m'aider pour ajouter les lignes n�cessaires?

Et on n'est pas l� pour faire les corrections � ta place, mais pour t'aider � les faire ;)
14/06/2006, 10h15
gregius

Citation:

Envoy� par Eric Berger

Dans ce cas, Ajax ne sera pas plus efficace, si tu recharges une page, Ajax ne sera pas � m�me de maintenir l'�tat.

Et on n'est pas l� pour faire les corrections � ta place, mais pour t'aider � les faire ;)

M�me pas une id�e des fonctions que je devrais utiliser?
Vous �tes rudes... snif snif