Newsgroup: it.comp.lang.javascript
Titolo: jslabs dHTML.JS documentetion...non capisco!!!

Guardando la documentazione di JSlabs su dHTML.js mi sono imbattuto nella
funzione writeLayer(layer, text) e ho pensato potesse servirmi...cosi' ho
provato a vedere come funzione ricopiando l'esempio in questo modo:
<html>
<head>
<script language="javascript">
writeLayer(layerid, "sample text")
writeLayer("layerid", 100)
writeLayer(0, "sample text")
</script>
</head>
<body>
<div ID="layerid" syle="position:absolute">
text
</div>
</body>
</html>
ma non mi funziona ne con IE ne con NN dandomi due errori diversi
IE  : Riga 4 Carattere1 "layerid" non e' definito
NN: line 4: writeLayer is not defined.
Qualcuno mi sa spiegare come si usa questa funzione e dove ho sbagliato?
Mi interesserebbe anche sapere se in NN si riescono a passare delle
variabili da un Layer all'altro o se come con document.write tutte le
variabili vengono annullate.
Grazie
Vic

Credo che l'errore sia questo: quando scrivi writeLayer(layerid, "sample
text"), l'oggetto layerid non è ancora stato creato, quindi non è definito.
Prova ad inserire il codice in una funzione da richiamare alla creazione del
layer oppure sposta il codice sotto il layer
Ciao
Giuseppe Di Natale
gdin...@camomillaitalia.it
------------------------------------------
JS Labs - FAQ di it.comp.lang.javascript
http://jslabs.webhostme.com
jsl...@yahoo.com
------------------------------------------


Ho provato in questi due modi ma il risultato non cambia...potreste postare
un esempio funzionante dell'uso di writeLayer()?
1)
<html>
<head>
</head>
<body>
<div ID="layerid" syle="position:absolute">
<script language="javascript">
writeLayer(layerid, "sample text")
</script>
</div>
</body>
</html>
2)
<html>
<head>
</head>
<body>
<div ID="layerid" syle="position:absolute">
</div>
<script language="javascript">
writeLayer(layerid, "sample text")
</script>
</body>
</html>

Lo script non ti funzionerà finchè non includi la libreria all'interno della
pagina con questo tag:
<script language="javascript"
src="
http://www.probo.it/javascript/dhtml.js
"></script>
Le funzioni descritte nella documentazione sono infatti prese da una
libreria aggiuntiva creata da Darius e Fly, non sono quindi incluse negli
interpreti JavaScript dei browser.
Comunque eccoti lo script funzionante:
<html>
<head>
<script language="JavaScript"
src="
http://www.probo.it/javascript/dHTML.js
"></script>
</head>
<body>
<div ID="layerid" syle="position:absolute">
</div>
<script language="javascript">
writeLayer(layerid, "sample text")
</script>
</body>
</html>
Così serve a ben poco, un utilizzo potrebbe essere quello di associare ad
esempio la chiamata della funzione writeLayer con un evento del mouse:
<div id="layerid" style="position:absolute"
onmouseover="writeLayer('layerid','Ciao')"></div>
Ciao
Giuseppe Di Natale
gdin...@camomillaitalia.it
------------------------------------------
JS Labs - FAQ di it.comp.lang.javascript
http://jslabs.webhostme.com
FlyScript by JS Labs, JS in 3 click
http://jslabs.webhostme.com/servizi/flyscript/
------------------------------------------


 <div id="layerid" style="position:absolute"
onmouseover="writeLayer('layerid','Ciao')"></div>
Altro guaio di Netscape: il browser non cattura automaticamente gli eventi
mouseover e mouseout sui <div> e sugli <span>, ma solo sui <layer>: c'è
bisogno di catturare l'evento con captureEvents(), oppure usare la funzione
setEvent() della libreria...
La sintassi per setEvent (non ricordo se nella documentazione ci sia o meno,
forse no), è la seguente:
    setEvent(nomeOggetto, evento, azione)
"nomeOggetto" è una stringa contenente l'oggetto che deve catturare un
evento.
"evento" è una stringa che indica appunto l'evento, e si presenta come
"onmouseover", "onmouseout", etc...
"azione" può essere una stringa eseguibile, come per esempio
"alert('ciao')", oppure una funzione, quindi si deve scrivere il nome della
funzione senza parentesi (vedi esempio 2):
Esempi:
1)    setEvent(__reachLayer("layerid"),  "onmouseover",  "alert('ciao')")
__reachLayer(Layer) è una funzione che ritorna una stringa contenente il
percorso di un layer, ovvero "document.all.layerid" per IE, e
"document.layers.layerid" per Netscape.
Per i layers usiamo sempre questa funzione perché restituisce un parametro
stringa, ed è proprio quello che ci serve...
2) sia data una funzione pippo:
    function pippo()
    {
        alert("pluto")
    }
si potrà far puntare l'evento alla funzione pippo in questo modo:
    setEvent(__reachLayer("layerid"),  "onmouseover",  pippo)
In pratica, per realizzare correttamente quello che volevi fare tu,
Giuseppe, conviene usare una funzione di inizializzazione (ricordo che
questa via che può sembrare un po' "strampalata" si rende necessaria solo
perché Netscape non attiva automaticamente l'onmouseover e l'onmouseout sui
tag <div> e <span>!!):
<html><head>
<script src="dhtml.js"></script>
<script>
function inizializza_eventi()
{
setEvent(__reachLayer("layerid"),"onmouseover","writeLayer('layerid','mouseo
ver event occured')")
setEvent(__reachLayer("layerid"),"onmouseout","writeLayer('layerid','mouseou
t event occurred')")
}
</script>
</head>
<body onload="inizializza_eventi()">
<div id="layerid" style="position:absolute; left:300; top:300;">ora questo
layer reagisce agli eventi mouseover e mouseout con tutti i
browsers.<br>Attenzione che se un layer è vuoto, e non gli si mette niente
dentro, avrà per default larghezza e altezza uguali a 0, e ovviamente un
oggetto di dimensioni nulle non catturerà mai gli eventi del mouse, almeno
finché gli si danno delle dimenisioni strettamente positive...</div>
</body></html>
Ad ogni modo sto preparando una specie di corso guidato all'uso della
libreria dhtml.js, che insieme ad un sacco di esempi pratici di utilizzo,
spiegazioni e soluzioni concrete dovrebbe chiarire i vari dubbi... :)
Bye.
Ðarius.

 variabili vengono annullate.
Dunque... il funzionamento di writeLayer() č proprio quello che dici: per IE
si tratta di un "document.all.nomelayer.innerHTML=text", mentre per Netscape
di un "document.layers.nomelayer.document.write(text)"
Ad ogni modo non sono sicuro di aver capito quello che vuoi sapere.
Se la tua situazione č questa:
<div id="layer1" style="position:absolute;">
    <script>
        var variabile1="valore1"
        var variabile2="valore2"
    </script>
    .....
</div>
appena riscrivi il layer (anche con document.write) le variabili non
verranno perse, ma visibili con Netscape da
"document.layers.layer1.variabile1".
Explorer invece queste variabili (nemmeno lui le cancella) le considera come
variabili globali, quindi non devi riferirti al layer quando le interroghi:
Se vuoi puoi leggere una di queste variabili usando l'operatore ternario:
    alert("'variabile1'    contiene:   "     +
_ns?document.layers.layer1.variabile1:variabile1)
Fammi sapere...
Alla prox.
Šarius.

 src="
http://www.probo.it/javascript/dhtml.js
"></script>
Ok..fatto e funziona tutto...su IE...su NN continuo ad avere un problema ma
penso che sia irrisolvibile. Sbaglio o NN anche con questa libreria si
comporta come document.write cioe' cancella le variabili una volta che viene
richiamata la libreria?
Io sto cercando di passare dei dati da un layer a un'altro rendendoli
visibili a turno ma con NN mi da errore di Javascript dicendomi che la form
non ha attributi.
sbaglio io qualcosa o proprio non c'e' maniera?
Grazie mille per l'aiuto comunque...al limite lo usero' in un altra
occasione se proprio non funziona per questo.
vic

 Se la tua situazione è questa:
Come scrivevo in risposta a Giuseppe la mia situazione e' la seguente:
Layer 1 contiene una form
Layer2 e' vuoto e dovra' visualizzare i dati della form all'evento onClick.
OnClick mi richiama una funzione che nasconde il Layer1 e mi rende visibile
il Layer2 riempiendolo.
se ho capito bene mettendo
var nome=""
come variabile globale di uno script in layer1 e all'interno della funzione
nome=document.layer.layer.nome
layerWrite(Layer2, "nome = "+nome)
dovrebbe funzionare anche in Netscape..
adesso provo e poi ti faccio sapere...
una cosa dalla risposta di giuseppe evinco che la libreria e'
scaricabile...ma non ho trovato da dove..:-(
vic

 vic
Bhe come al solito prima di scrivere dovrei stare piu' attento...infatti
l'ho trovata subito..:-)
non avevo capito che nel file zip c'era sia la libreria che la
documentazione...
resta valida l'altra parte del post...
vic

Scusami ancora Darius ma mi sa che non ho capito niente...
allora questa e' la pagina che vorrei utilizzare (semplificata) e mi
funziona perfettamente in IE mentre in NN non riesco proprio a capire cosa
devo fare...ho provato vari metodi ma non mi funziona mai.
<HEAD>
   <TITLE>Form Agenti</TITLE>
<script language="javascript"
src="dhtml.js"></script>
<style>
#layer1 {position:absolute; left:0; top:100; visibility:visible;}
#layer2 {position:absolute; left:0; top:100; width:100%; visibility:hidden;}
</style>
<SCRIPT language="JavaScript" type="text/javascript">
var nome="";
function submitForm() {
  var nome = document.forms[0].elements[0].value;
  writeLayer(layer2, "<center><font size=3 color=blue>nome = </font><font
size=3 color=red>"+nome+"</font></center>");
          if (navigator.appName == "Netscape") {
            layerStyleRef="layer.";
            layerRef="document.layers";
            styleSwitch="";
            }else{
            layerStyleRef="layer.style.";
            layerRef="document.all";
            styleSwitch=".style";
            }
        eval(layerRef+'["layer1"]'+styleSwitch+'.visibility="hidden"');
        eval(layerRef+'["layer2"]'+styleSwitch+'.visibility="visible"');
}
</script>
</head>
<BODY>
<CENTER>
<FONT face="Arial,Helvetica" size="+3">
Prova Layers e Form
</FONT>
</CENTER>
<Div ID="layer1">
<CENTER>
<FORM>
<TABLE border="1" cellpadding="1" width="100%">
<TR>
<TD align="left">
<B>Nome e cognome:</B><BR>
<INPUT type="text" name="name">
</TD>
<TD align="center" valign=bottom>
<INPUT type="reset" value="Azzera">
</TD>
<TD align="center"  valign=bottom>
<INPUT type="button" value="Continua" onClick="submitForm()">
</TD>
</TR>
</table>
</form>
</div>
<Div ID="layer2">
</div>
</body>


 <html>
 <HEAD>
    <TITLE>Form Agenti</TITLE>
    <script language="javascript" src="dhtml.js"></script>
    <style>
    #layer1 {position:absolute; left:0; top:100; width:100%;
visibility:visible;}
    #layer2 {position:absolute; left:0; top:100; width:100%;
visibility:hidden;}
    </style>
 <SCRIPT language="JavaScript" type="text/javascript">
 function submitForm() {
// visto che il form è dentro il layer, con netscape bisogna cercarlo dentro
il layer, quindi in document.layers...., mentre in ie ci si riferisce
all'oggetto direttamente dal documento...
 var nome =
_ie?document.forms[0].elements[0].value:document.layers.layer1.document.form
s[0].elements[0].value;
// il problema quindi non è della variabile globale, né della perdita delle
variabili dai layers, che invece rimangono sempre in memoria...
 writeLayer("layer2", "<center><font size=3 color=blue>nome = </font><font
size=3 color=red>"+nome+"</font></center>");
// per nascondere e far mostrare layers, invece basta poco... :)
 showLayer("layer1",false)
 showLayer("layer2",true)
 }
 </script>
 </head>
 <BODY>
 <CENTER>
 <FONT face="Arial,Helvetica" size="+3">
 Prova Layers e Form
 </FONT>
 </CENTER>
<!-- Hai fatto un po' di confusione tra l'uso delle classi css e gli id dei
layers...
se vuoi applicare gli stili che hai definito sopra nei tag <style> devi
specificare class="layer1"....  -->
<div class="layer1" id="layer1">
 <form name=f0>
 <CENTER>
 <TABLE border="1" cellpadding="1" width="100%">
 <TR>
 <TD align="left">
 <B>Nome e cognome:</B><BR>
 <INPUT type="text" name="name">
 </TD>
 <TD align="center" valign=bottom>
 <INPUT type="reset" value="Azzera">
 </TD>
 <TD align="center"  valign=bottom>
 <INPUT type="button" value="Continua" onClick="submitForm()">
 </TD>
 </TR>
 </table>
 </center>
 </form>
</div>
 <Div ID="layer2" class="layer2">
 </div>
 </body></html>
Alla prox.
Ðarius.

 Šarius.
Alla prox..e grazie ancora
vic

 vic
Figurati...
Fammi sapere...
;)
Bye.
Ðarius.

ciao Darius...
Problema...:-(
ho scritto esattamente come mi hai detto tu e mentre con IE non mi da 
nessun problema con NN mi da un errore alla linea 105 in quanto mi dice 
che document.layers.layer2 non ha proprieta'...e proprio non lo 
capisco...:-(
questo e' quello che ho scritto:
<!--
<HTML>
<HEAD>
   <TITLE>Prova Layers</TITLE>
<SCRIPT language="JavaScript" type="text/javascript" src="dhtml.js">
</SCRIPT>
<STYLE>
#layer1 {position:absolute; left:0; top:100; Width:100%; 
visibility:visible;}
#layer2 {position:absolute; left:0; top:100; Width:100%; 
visibility:hidden; visibility:hide;}
</STYLE>
<SCRIPT language="JavaScript" type="text/javascript">
function submitForm() {
 
        var nome = 
_ie?document.forms[0].elements[0].value:document.layers.layer1.document.f
orms[0].elements[0].value;
        writeLayer("layer2", "<center><font size=3 color=blue>nome = 
</font><font size=3 color=red>"+nome+"</font></center>");
        showLayer("layer1",false);
        showLayer("layer2",true);
}
</SCRIPT>
</HEAD>
<BODY TEXT="#000000" BGCOLOR="#FFFFFF">
<CENTER>
<FONT face="Arial,Helvetica" size="+3">
Prova Agenti
</FONT>
</CENTER>
<div class="layer1" id="layer1">
<CENTER>
<FORM>
<CENTER>
<TABLE border="1" cellpadding="1" width="100%">
<TR>
<TD align="left">
<B>Nome e Cognome:</B><BR>
<INPUT type="text" name="name">
</TD>
<TD align="center" valign=bottom>
<INPUT type="reset" value="Azzera">
</TD>
<TD align="center" valign=bottom>       
<INPUT type="button" value="Continua" onClick="submitForm()">
</TD>
</TR>
</table>
</center>
</form>
</div>
<div class="layer2" id="layer2">
</div>
</body>
</html>
-->

 <!--
Hai messo i delimitatori di commento per tutto il documento?
Nello stile, cmq, devi impostare solo visibility:hidden; oppure visible.
show e hide li usi solo da JavaScript, e in ogni caso, se usi la libreria
DHTML.js, sono definite le variabili:
visible, show, hidden, hide, che contengono il valore appropriato "visible",
"show", "hidden", "hide", in base al browser in cui ci si trova,
sollevandoti dalla responsabilità di gestire la situazione... :)
Per quanto riguarda l'errore con Netscape, era causato da errori nell'HTML..
avevi dimenticato di chiudere alcuni tags... :)
 <HTML>
 <HEAD>
    <TITLE>Prova Layers</TITLE>
 <SCRIPT language="JavaScript" type="text/javascript" src="dhtml.js">
 </SCRIPT>
 <STYLE>
 #layer1 {position:absolute; left:0; top:100; Width:100%;
visibility:visible;}
 #layer2 {position:absolute; left:0; top:100; Width:100%;
visibility:hidden; }
</STYLE>
<!-- visibility:hide si usa solo da Javascript, non via css... -->
 <SCRIPT language="JavaScript" type="text/javascript">
 function submitForm() {
         var nome =
_ie?document.forms[0].elements[0].value:document.layers.layer1.document.form
s[0].elements[0].value;
         writeLayer("layer2", "<center><font size=3 color=blue>nome =
</font><font size=3 color=red>"+nome+"</font></center>");
         showLayer("layer1",false);
         showLayer("layer2",true);
 }
 </SCRIPT>
 </HEAD>
 <BODY TEXT="#000000" BGCOLOR="#FFFFFF">
 <CENTER>
 <FONT face="Arial,Helvetica" size="+3">
 Prova Agenti
 </FONT>
 </CENTER>
 <div class="layer1" id="layer1">
  <CENTER>
  <FORM>
  <TABLE border="1" cellpadding="1" width="100%">
  <TR>
  <TD align="left">
   <B>Nome e Cognome:</B><BR>
   <INPUT type="text" name="name">
  </TD>
  <TD align="center" valign=bottom>
   <INPUT type="reset" value="Azzera">
  </TD>
  <TD align="center" valign=bottom>
   <INPUT type="button" value="Continua" onClick="submitForm()">
  </TD>
  </TR>
  </table>
  </form>
  </center>
 </div>
 <div class="layer2" id="layer2">
 </div>
 </body>
 </html>
Bye.
Ðarius.


Ops...vedi cosa succede a usare IE!!!! lui i tags li ignora..chiusi o aperti
fa lo stesso..:-(
E io a scervellarmi sugli script senza vedere le cose macroscopiche!!!
mi cospargo il capo di cenere...
scusa del disturbo e grazie ancora..
vic

 mi cospargo il capo di cenere...
inginocchiati sui ceci, piuttosto...


 inginocchiati sui ceci, piuttosto...
Nooo i ceci no!!!!!! ti prego!!!!!
vic