Menù dinamico con XML e Javascript

  • Creatore Discussione Creatore Discussione guliver
  • Data di inizio Data di inizio
G

guliver

Utente Attivo
20 Lug 2006
43
0
0
Salve a tutti, ho creato un file xml. Il contenuto di questo file deve esser visualizzato in un menù creato con javascrit..vi posto il file ke nn funziona

HTML: 
<html dir="ltr">
<HEAD>
     
     <Title ID=onetidTitle>Page</Title>
    <script language=JavaScript>

var menus=[],_m3=window.external?[' style="width:787;height:100%"','div onclick="','div']:['','a href="javascript:','a'],_mC=document.getElementById?function(_mR){return document.getElementById(_mR)}:function(_mR){return document.all[_mR]};function menu(_m1,_mO){var _=this,i;_._m1=_m1;_._mO=_mO;_._mS='';_.id=menus.length;_._m0=[];_._m2=[];_._m4=[0,0];_._mO[-1]={'firstX':20,'firstY':20,'nextX':100,'nextY':15,'width':99,'height':62,'hideAfter':200,'target':'_self','trace':0,'css':''};for(i=0;i<_._m1.length;i++)if(_._m1[i])new _mE(0,_,_,_._m1[i]);for(i=0;i<_._m2.length;i++)_mA(_._m2[i],1);menus[_.id]=_;}function _mD(_mK){var i,a=menus[_mK]._m0;for(i=0;i<a.length;i++){_mA(a[i],0);_mB(a[i],'norm');}}function _mF(_mK,_mI){var m=menus[_mK],_=m._m0[_mI]._m1[1];_mB(m._m0[_mI],'clck');if(_)open(_,_m9(m._m0[_mI]._m8,m._mO,'target'));}function _mG(_mK,_mI){var m=menus[_mK];m._mL=setTimeout('_mD('+_mK+')',_m9(m._mN._m8,m._mO,'hideAfter'));if(m._mN.id==_mI)m._mN=null;}function _mH(_mK,_mI){var m=menus[_mK],_,_m7,i;m._mN=_=m._m0[_mI];if(m._mL)clearTimeout(m._mL);for(i=0;i<m._m0.length;i++){_=m._m0[i];_m7=!m._mN._mS.indexOf(_._mT);if(_m7)_mB(_,_==m._mN?'over':'norm');_mA(_,_m7);}if(m._mN._m6)for(i=m._mN;i&&i._m5;i=i._mP)_mB(i,'over');}function _mE(l,p,m,_m1){var _=this,i,c=p._m2.length,_mO=m._mO;_._m1=_m1;_._mP=p;_._mT=p._mS;_._mS=p._mS+c+':';_._m8=l;_.id=m._m0.length;m._m0[_.id]=_;p._m2[c]=_;var id=m.id+','+_.id,nX,nY;_._m6=_m9(l,_mO,'trace');for(i=l;i>=-1;i--){if(_mO[i]&&_mO[i]['nextX']!=null)nX=_mO[i]['nextX'];if(_mO[i]&&_mO[i]['nextY']!=null)nY=_mO[i]['nextY'];if(nX!=null||nY!=null)break;}_._m4=[p._m4[0]+_m9(l,_mO,'firstX')+(nX!=null?nX*c+_m9(l,_mO,'width')*c:0),p._m4[1]+_m9(l,_mO,'firstY')+(nY!=null?nY*c+_m9(l,_mO,'height')*c:0)];document.write('<',_m3[1],'_mF(',id,')" id="me',id,'" style="position:absolute;top:',_._m4[1],'px;left:',_._m4[0],'px;width:',_m9(l,_mO,'width'),'px;height:',_m9(l,_mO,'height'),'px;visibility:hidden;z-index:',l,';text-decoration:none" onmouseout="_mG(',id,')" onmouseover="_mH(',id,')"><div',_m3[0],' id="mi',id,'" class="',_m9(l,_mO,'css'),'norm">',_m1[0],'</div></',_m3[2],'>');_._m5=[_mC('me'+m.id+','+_.id),_mC('mi'+m.id+','+_.id),_m9(l,_mO,'css')];if(_m1.length>2){_._m2=[];for(i=2;i<_m1.length;i++)if(_m1[i])new _mE(l+1,_,m,_m1[i]);}}function _mA(_,_mJ){if(_._mQ==_mJ)return;_._mQ=_mJ;if(_mJ)_._m5[0].style.visibility='visible';else if(_._m8)_._m5[0].style.visibility='hidden';}function _mB(_,_mM){if(_._m5[3]==_mM)return;_._m5[3]=_mM;_._m5[1].className=_._m5[2]+_mM}function _m9(l,_mO,k){for(var i=l;i>=-1;i--)if(_mO[i]&&_mO[i][k]!=null)return _mO[i][k];}
</script>
<script language=JavaScript>

var Home = new Array();
var Overview = new Array();
var Overview_SUD = new Array();
var Overview_NORD = new Array();
var Report = new Array();
var Report_Bilancio = new Array();

function Leggi()
	{
	var Nodo = xml.getElementsByTagName("Home")[0].getElementsByTagName("item");
	LeggiHome(Nodo);
	var Nodo = xml.getElementsByTagName("Overview")[0].getElementsByTagName("item");
	LeggiOverview(Nodo);	
	var Nodo = xml.getElementsByTagName("Overview_SUD")[0].getElementsByTagName("item");
	LeggiOverview_SUD(Nodo);
	var Nodo = xml.getElementsByTagName("Overview_NORD")[0].getElementsByTagName("item");
	LeggiOverview_NORD(Nodo);
	var Nodo = xml.getElementsByTagName("Report")[0].getElementsByTagName("item");
	LeggiReport(Nodo);
	var Nodo = xml.getElementsByTagName("Report_Bilancio")[0].getElementsByTagName("item");
	LeggiReport_Bilancio(Nodo);

	testo = "<BR>";
	for (var i = 0 ; i < Home.length ; i++ )
[B]ma questo var menuHierarchy non me mette
nientenel menù[/B]
[I][B]var menuHierarchy = [
['Home[i].Abstract', 'http://prova.aspx'],[/B][/I]


		
				
	testo += "<BR>"
	for (var i = 0 ; i < Overview.length ; i++ )
	testo += Overview[i].Link;
	 		

	testo += "<BR>"
	for (var i = 0 ; i < Overview_SUD.length ; i++ )
		testo += "<A HREF='"+Overview_SUD[i].Href+"' TARGET='_"+
				Overview_SUD[i].Target+"'>"+
				Overview_SUD[i].Link+"</A><BR>";
				
	testo += "<BR>"
	for (var i = 0 ; i < Overview_NORD.length ; i++ )
		testo += "<A HREF='"+Overview_NORD[i].Href+"' TARGET='_"+
				Overview_NORD[i].Target+"'>"+
				Overview_NORD[i].Link+"</A><BR>";
				
	testo += "<BR>"
	for (var i = 0 ; i < Report.length ; i++ )
		testo += Report[i].Link;

	testo += "<BR>"
	for (var i = 0 ; i < Report_Bilancio.length ; i++ )
		testo += "<A HREF='"+Report_Bilancio[i].Href+"' TARGET='_"+
				Report_Bilancio[i].Target+"'>"+
				Report_Bilancio[i].Link+"</A><BR>";


				
				

	document.getElementById("livello").innerHTML=testo;

	}
var menuHierarchy = [
['testo', 'http://sr2k28:81/erg/default.aspx'],]
function LeggiHome(obj)
	{
	for (i = 0 ; i < obj.length ; i++)
		Home[i] = new dati(
									getValue(obj[i],"href") , 
									getValue(obj[i],"href","target") , 
									getValue(obj[i],"link"),
									getValue(obj[i],"abstract")
									) 
	}
	function LeggiOverview(obj)
	{
	for (i = 0 ; i < obj.length ; i++)
		Overview[i] = new dati(
									getValue(obj[i],"href") , 
									getValue(obj[i],"href","target") , 
									getValue(obj[i],"link"),
									getValue(obj[i],"abstract")
									) 
	}

function LeggiOverview_SUD(obj)
	{
	for (i = 0 ; i < obj.length ; i++)
		Overview_SUD[i] = new dati(
										getValue(obj[i],"href") , 
										getValue(obj[i],"href","target") , 
										getValue(obj[i],"link") , 
										getValue(obj[i],"abstract")
										) 
	}
function LeggiOverview_NORD(obj)
	{
	for (i = 0 ; i < obj.length ; i++)
		Overview_NORD[i] = new dati(
										getValue(obj[i],"href") , 
										getValue(obj[i],"href","target") , 
										getValue(obj[i],"link") , 
										getValue(obj[i],"abstract")
										) 
	}
function LeggiReport(obj)
	{
	for (i = 0 ; i < obj.length ; i++)
		Report[i] = new dati(
										getValue(obj[i],"href") , 
										getValue(obj[i],"href","target") , 
										getValue(obj[i],"link") , 
										getValue(obj[i],"abstract")
										) 
	}
function LeggiReport_Bilancio(obj)
	{
	for (i = 0 ; i < obj.length ; i++)
		Report_Bilancio[i] = new dati(
										getValue(obj[i],"href") , 
										getValue(obj[i],"href","target") , 
										getValue(obj[i],"link") , 
										getValue(obj[i],"abstract")
										) 
	}









function getValue(vobj,tag,param)
	{
	if (param)
		return vobj.getElementsByTagName(tag)[0].getAttribute(param);
	else
		return vobj.getElementsByTagName(tag)[0].childNodes[0].nodeValue;
	}

function dati(Href, Target, Link, Abstract)
	{
	this.Href=Href;
	this.Target=Target;
	this.Link=Link;
	this.Abstract=Abstract;
	}





</script>
<style>
body {
	font: 11px Arial,Verdana,Helvetica,sans-serif;
}
</style>

<style>
.gurtl0onorm {
	padding: 4px;
	font: 12px Arial, Tahoma, Verdana, Geneva, Helvetica, sans-serif;
	text-decoration: none;
	border: 1px solid #0099FF;
	border-left: 4px solid #0099FF;
	background: #0099FF;
	color: white;
	cursor: hand;
}
.gurtl0oover {
	padding: 4px;
	font: 12px Arial, Tahoma, Verdana, Geneva, Helvetica, sans-serif;
	text-decoration: none;
	border: 1px solid #A4A4A4;
	border-left: 4px solid #E1B700;
	background: #A4A4A4;
	color: white;
	cursor: hand;
}
.gurtl0oclck {
	padding: 4px;
	font: 12px Arial, Tahoma, Verdana, Geneva, Helvetica, sans-serif;
	text-decoration: none;
	border: 1px solid #A4A4A4;
	border-left: 4px solid #E1B700;
	background: #949494;
	color: white;
	cursor: hand;
}
.gurtl1onorm {
	padding: 3px;
	font: 12px Arial, Tahoma, Verdana, Geneva, Helvetica, sans-serif;
	text-decoration: none;
	border: 1px solid white;
	border-left: 4px solid #EBEFEF;
	background: #EBEFEF;
	color: #243D4B;
	cursor: hand;
}
.gurtl1oover {
	padding: 3px;
	font: 12px Arial, Tahoma, Verdana, Geneva, Helvetica, sans-serif;
	text-decoration: none;
	border: 1px solid white;
	border-left: 4px solid #E1B700;
	background: #EBEFEF;
	color: #243D4B;
	cursor: hand;
}
.gurtl1oclck {
	padding: 3px;
	font: 12px Arial, Tahoma, Verdana, Geneva, Helvetica, sans-serif;
	text-decoration: none;
	border: 1px solid white;
	border-left: 4px solid #E1B700;
	background: #DBDFDF;
	color: #243D4B;
	cursor: hand;
}

</style>

<meta name="Microsoft Theme" content="none, default">
<meta name="Microsoft Border" content="none">
</HEAD>
<body>
<DIV ID="livello"></DIV>
    <form runat="server">
        <div align="center">
        <table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
            <!-- Begin SharePoint Head Banner--> <tr> <td valign="top" width="100%"> 
				<div align="center">
					<table cellpadding="0" cellspacing="0" border="0" width="100%">
<TR> 
  <TD COLSPAN=3 WIDTH=100%>
  <p align="center">
	<img border="0" src="../images/top.jpg"></p>
  <!--Top bar-->
  
  </TD> 
 </TR>

            </table> </div>
				</td> </tr> <!-- End SharePoint Head Banner-->
            

            <!-- Begin WebPartPage Title --> <tr> <td valign="top" width="80%"> &nbsp;</td> </tr> <!-- End WebPartPage Title -->
            <tr> <td valign="top" width="100%" height="100%" style="margin:4px" > <!-- Begin Panel Layout --> <PlaceHolder id="MSO_ContentDiv" runat="server">
				<div align="center">
				<table id="MSO_ContentTable" cellpadding="2" cellspacing="1" border="0" width="1014" height="280">
                <tr><td  height="10" width="318">
		<script language="JavaScript">
<!--



var XMLFile = "menu.xml"
var xml = null;

if (document.implementation && document.implementation.createDocument)
	{
	xml = document.implementation.createDocument("","",null)
	xml.onload=Leggi
	xml.load(XMLFile);
	}
	else if (window.ActiveXObject)
		{
		xml = new ActiveXObject("Microsoft.XMLDOM")
		xml.onreadystatechange = IEGo;
		xml.load(XMLFile);
		}
	
function IEGo()
	{
	if (xml.readyState == 4)
		Leggi();
	}	

largSchermo = document.body.clientWidth/2
largTabella = 990/2+7
finaleX= largSchermo - largTabella 

var menuConfig = [
{
	'height':  20,
	'width' : 72,
	'firstX' : finaleX-2,
	'firstY' : 188,
	'nextX' : 2,
	'hideAfter' : 200,
	'css'   : 'gurtl0o',
	'trace' : true
},
{
	'height':  23,
	'width' : 70,
	'firstY' : 25,
	'firstX' :  0,
	'nextY' : -1,
	'css' : 'gurtl1o'
},
{
	'firstX' : 110,
	'firstY' : 0
}
];

new menu (testo, menuConfig);
//-->
</script>

ma nella variabile var menuHierarchy non inserisce niente... e questa la variabile dove andare ad inserire i campi creati nel file xml per poi visualizzarli nel menù...
Grazie..sono un po' confuso....
Ciao
 
Non usare Javascript per leggere dal file XML ma ASP o PHP, a seconda del linguaggio lato server del tuo sito.

Una volta estratti i dati, il meccanismo di animazione del menu lo crei con Javascript: se usi SOLO Javascript i link non si indicizzano nemmeno.

hai conoscenza di ASP o PHP?
 
avrei intensione di utilizzare asp, ma non so come devo fare....
Grazie per la pasienza...ciao
 
scusami, ma una volta estratto il contenuto dell'xml con asp cosi:
Codice: 
<%
Dim objXmlDom
Set objXmlDom = Server.CreateObject("Microsoft.XMLDOM")
    objXmlDom.async = False
    objXmlDom.load Server.MapPath("database.xml")

Dim nome, cognome
Set nome = objXmlDom.getElementsByTagName("record/nome")
Set cognome = objXmlDom.getElementsByTagName("record/cognome")

Dim i
i = 0
For i = 0 To nome.length - 1
    Response.Write nome(i).Text & " " & cognome(i).Text & "<br>"
Next

Set nome = Nothing
Set cognome = Nothing
Set objXmlDom = Nothing
%>
Come faccio ad inserirlo in questo codice javascript?
Codice: 
<script=javascript>
var menuHierarchy = [
['Home', 'http://www.nuovo.aspx'],]
</script>
..
Grazie e ciao
 
Una volta che il codice ASP estrae i dati dal file XML ti restituisce il risultato in formato HTML, quindi, se in XML hai:

<nome>Luca</nome>

manipolando l'output avrai semplcemente:

Luca

A questo punto puoi stampare ilrisultato all'interno del codice Javascript cosi:

document.write("<%="Luca"%>")

Al posto di scrivere il dato "staticamente" come nel mio banale esempio, estrai il nodo del file XML e te lo formatti nel tuo codice Javascript come ti pare.

Tieni presente che il codice del menu che hai postato in origine puoi anche buttarlo, dato che estrae i dati dall'XML con Javascript ed è più un casino recuperaro che non rifarlo o adattarne uno più malleabile.

Vedi su questo mio sito:

http://www.menujavascript.org/

se trovi il menu che fa per te ed adattalo alle tue esigenze.

Ciao!
 
Devi accedere o registrarti per poter rispondere.

Discussioni simili

L
Menù dinamico con diverse lingue e visualizzazione pagina corrente
Risposte
5
Visite
2K
PHP
Fez Vrasta
F
S
Menù dinamico con categorie e sottocategorie
Risposte
8
Visite
8K
Classic ASP
Sirio
S
B
Creare menù dinamico con AJAX e PHP
Risposte
4
Visite
6K
PHP
busutm
B
M
Form con menù dinamico da database
Risposte
10
Visite
5K
PHP
megarospo
M
F
menù select dinamico da db in php
Risposte
3
Visite
2K
PHP
zorro
zorro
W
menù dinamico
Risposte
3
Visite
2K
HTML e CSS
PoLe
PoLe
G
Elementi Menù orizzontali
Risposte
2
Visite
1K
HTML e CSS
Gae
G
psikolele
Dropdown menù
Risposte
2
Visite
1K
HTML e CSS
psikolele
psikolele
G
Menù a tendina di ricerca con query
Risposte
1
Visite
2K
PHP
macus_adi
macus_adi
L
Menù con switch case
Risposte
1
Visite
1K
C/C++
marino51
marino51
J
Richiama descrizione da menù
Risposte
11
Visite
1K
PHP
illiterate2020
I
Z
Menù di navigazione responsivo
Risposte
0
Visite
1K
HTML e CSS
zanzarabeo
Z
R
Barra del menù principale decentrata
Risposte
4
Visite
4K
Joomla
rimade-56
R
M
Stringa con spazi nel menù a tendina
Risposte
4
Visite
2K
PHP
Max61
M
A
Menù a tendina collegato a database
Risposte
13
Visite
3K
PHP
AndreaBet
A
D
Aumentare i sublevel del menù del theme
Risposte
1
Visite
1K
Webdesign e Grafica
Max 1
Max 1
Tommy03
Contenitore non si nasconde dietro al menù
Risposte
1
Visite
939
HTML e CSS
WmbertSea
WmbertSea
Tommy03
Due menù nella stessa app
Risposte
0
Visite
1K
Sviluppo app per Android
Tommy03
Tommy03
V
Menù CSS da file in cartella esterna
Risposte
4
Visite
2K
HTML e CSS
Veronica_
V
W
[Javascript] [HTML] menù responsive fisso
Risposte
2
Visite
2K
Javascript
wolfland
W
Alto Basso