Newsgroup: it.comp.lang.javascript
Titolo: Compatibilità script con replace in FF

Mi spiace inserire un post simile ad uno di poche ore fa, ma anche io 
ho un problema con uno script che funziona su IE ma non su FF.
In pratica ho fatto una pagina che permette, inseriti i nomi di 16 
squadre, di generare il relativo calendario delle partite.
In realtà il calendario è già bello che creato, lo script non fa che 
sostituire i nomi generici (squadra a, squadra b, etc) con quello 
inserito dall'utente in un form.
Purtroppo non so perché (sono troppo niubbo per capirlo da solo) ma non 
funziona con firefox...
Ecco la pagina web in questione, se volete vedere il funzionamento del 
tutto:
http://pialbo.altervista.org/calendarioa16squadre.htm
Riporto qui lo script:
<script type="text/javascript">
function creacalendario()
{
//Prende il calendario standard come base
var input = calendarioinizio.value;
var output = new String(input);
//Sostituisce al nome generico quello personalizzato
output = output.replace(/squadra a/g,a.value);
output = output.replace(/squadra b/g,b.value);
output = output.replace(/squadra c/g,c.value);
output = output.replace(/squadra d/g,d.value);
output = output.replace(/squadra e/g,e.value);
output = output.replace(/squadra f/g,f.value);
output = output.replace(/squadra g/g,g.value);
output = output.replace(/squadra h/g,h.value);
output = output.replace(/squadra i/g,i.value);
output = output.replace(/squadra l/g,l.value);
output = output.replace(/squadra m/g,m.value);
output = output.replace(/squadra n/g,n.value);
output = output.replace(/squadra o/g,o.value);
output = output.replace(/squadra p/g,p.value);
output = output.replace(/squadra q/g,q.value);
output = output.replace(/squadra r/g,r.value);
calendariook.value = output;
}
</script>
Grazie e non sgridatemi se ho scritto niubbate!
-- 
Pialbo - 
http://pialbo.altervista.org
AS Pialbo (547659) VI.388 * Alleanza neoICCP Universo1
Ricorda che: qui quo qua l'accento non ci va; lì, là, dà, sì (aff) con 
l'accento; so, sa, fa, do, va, sto, sta senza accento.

 output = output.replace(/squadra a/g,a.value);
scritto così non vuole dire molto: prendi un "a.value", che è "a"? idem per
tutto il resto.
-- 
"E' l' ignoranza che crea l'intolleranza
 di gente cieca e senza coscienza"
									  S.S.S.

 tutto il resto.
Hai ragione, posto tutta la parte di pagina in questione, accorciandola 
un po' per migliorare la leggibilità:
<script type="text/javascript">
function creacalendario()
{
//Prende il calendario standard come base
var input = calendarioinizio.value;
//creo una stringa
var output = new String(input);
//Sostituisce al nome generico quello personalizzato
output = output.replace(/squadra a/g,a.value);
output = output.replace(/squadra b/g,b.value);
output = output.replace(/squadra c/g,c.value);
output = output.replace(/squadra d/g,d.value);
//e così via fino a "squadra r"
calendariook.value = output;
}
</script><br>
Spiegazioni:
calendarioinizio.value è il testo nella textarea dove ho messo il 
calendario di default, che viene preso come input.
a.value (e b.value, c.value, etc.) è il testo immesso nel form 
dall'utente
calendariook.value è il risultato che comparirà nella textarea finale.
output è il risultato finale derivato dalle modifiche fatte a input.
Qui l'utente può inserire i nomi delle squadre (dall'1 al 16):
Inserisci nome squadra 1: <input name="a" size="20" maxlength="32" 
type="text"><br>
Inserisci nome squadra 2: <input name="b" size="20" maxlength="32" 
type="text"><br>
Inserisci nome squadra 3: <input name="c" size="20" maxlength="32" 
type="text"><br>
Inserisci nome squadra 4: <input name="d" size="20" maxlength="32" 
type="text"><br>
(e così via fino a 16)
Questa è la
<textarea name="calendarioinizio" cols="120" rows="120" style="display: 
none;">I Giornata
squadra a - squadra b
squadra c - squadra d
squadra e - squadra f
squadra g - squadra h
squadra i - squadra l
squadra m - squadra n
squadra o - squadra p
squadra q - squadra r
II Giornata
squadra n - squadra g
squadra p - squadra c
squadra r - squadra i
squadra h - squadra m
squadra b - squadra q
squadra d - squadra e
squadra l - squadra o
squadra f - squadra a
(e così via fino alla 15a giornata)
</textarea>
<br>
Questo è il bottone che lancia l'elaborazione:
<input id="bProcedi" value="elabora calendario" 
onclick="creacalendario()" type="button">
Questa è la textarea dove compare il calendario personalizzato:
<textarea name="calendariook" style="width: 200px; height: 200px;" 
cols="120" rows="120"></textarea>
Se può servire, sono partito da questo tutorial, e poi sono andato 
avanti per tentativi:
http://www.mrwebmaster.it/tutorial/js/tutorial205.htm


 Ma te lo ha generato il calendario?
Sě ... ho messo solo 3 squadre ma sotto ha scritto il calendario e la
console non genera errori.  Firefox 1.5.
-- 
"That until there is no longer first class
And second class citizens of any nation
Until the colour of a man's skin
Is of no more significance than the colour of his eyes
Me say war"
B.M.

 console non genera errori.  Firefox 1.5.
mumble mumble...
e allora che può essere?
A me non me lo visualizza!


 A me non me lo visualizza!
a) versione di firefox?
b) cosa dice la console javascript? (a parte un errore nel css, ma
sicuramente non è quello il problema)?
-- 
"Voi abili a tenere sempre un piede qua e uno là
 avrete un avvenire certo in questo mondo qua
 però la dignità
 dove l'avete persa?"
									    V.R.

 sicuramente non è quello il problema)?
mi dice solo l'errore del css (riga 103, avevo scritto letf al posto di 
left), ma non funziona nemmeno adesso che ho corretto l'errore. :-(


 ho la 1.5 anche io!
ho provato a disinstallare tutte le estensioni ma non è cambiato 
nulla... :-(


 nulla... :-(
:-O adesso non funziona manco a me, questa poi ...
non capisco perché mai non segnali errori, comunque sia prova ad
esplicitare. Dando un occhio al tuo codice invece non capisco come possa
funzionare in effetti...per esempio hai un 
 calendariook.value=output; 
ammettiamo pure che firefox possa beccare questo "calendariook"...ma, se
così fosse, sicuramente cercherà l'id mentre questa textarea ha il name.
Sostituisci tutti i riferimenti diretti con
 getElementById(iddelloggetto);
(es. document.getElementById("calendariook").value=output); ovviamente dopo
aver assegnato gli id ai tag che lo richiedono.


 un po' per migliorare la leggibilità:
Partendo dal codice che hai scritto in questo post:
<!-- inizio codice -->
<style type="text/css">
	ul#calendario{
		list-style-type:upper-roman;
		list-style-position:inside;
		font:bold 15px Trebuchet MS;
		margin:0;padding:2px;
	}
	li.giornata li{
		list-style-type:none;
		font:normal 12px Trebuchet MS;
	}
	li.giornata li strong{
		color:#174068;
	}
</style>
<script type="text/javascript">
var giornate = [
		[	0,1,
			2,3,
			4,5,
			6,7,
			8,9,
			10,11,
			12,13,
			14,15
		],
		[	11,6,
			13,2,
			15,8,
			7,10,
			1,14,
			3,4,
			9,12,
			5,0
		]
]
function creaCalendario(){
	var sHTML = "",
		squadre = document.getElementsByName("txtSquadre");
	for (var g =0;g<giornate.length;g++){
		sHTML += "<li class=\"giornata\">Giornata<ul>";
		for (var i = 0; i < giornate[g].length; i+=2){
			sHTML+="<li>squadra <strong>"+squadre[giornate[g][i]].value+"</strong> -
squadra <strong>"+squadre[giornate[g][i+1]].value+"</strong></li>";
		}
		sHTML +="</ul></li>";
	}
	document.getElementById("calendario").innerHTML = sHTML;
}
</script>
Inserisci nome squadra 1: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 2: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 3: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 4: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 5: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 6: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 7: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 8: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 9: <input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 10:<input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 11:<input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 12:<input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 13:<input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 14:<input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 15:<input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
Inserisci nome squadra 16:<input name="txtSquadre" size="20" maxlength="32"
type="text"><br>
<button onclick="creaCalendario()">crea calendario</button>
<ul id="calendario"></ul>
<!-- fine codice -->
Qualche appunto: 
Le textbox delle squadre hanno tutte lo stesso nome. In questo modo è
possibile recuperarle come array. E quindi, nel codice js, "squadre[0]"
identifica la prima texbox, "squadre[1]" la seconda, e così via.
La variabile "giornate" è un array, un elemento per ogni giornata definita.
Ogni elemento dell'array giornate, è a sua volta un array. Esso contiene gli
"accoppiamenti" delle varie squadre, specificando due a due gli indici delle
stesse. Quindi, come per i textbox, "0" identifica la prima squadra, "1" la
seconda e così via.
Il codice html generato viene posto in una lista (UL). Tramite CSS vengono
impostate alcune proprietà, come font e il tipo di numerazione. Nel caso della
giornata è stato scelta la numerazione romana, perché il tuo esempio riportava
quella.
Puoi anche cambiarla, oppure decidere di aggiungere una numerazione anche per
ogni "accoppiamento" delle squadre. Il tutto modificando unicamente il CSS.
Sempre agendo su quest'ultimo, puoi impostare la lista in modo che abbia
un'altezza e/o larghezza fissa, e aggiungere le scrollbar. Oppure colorare i
nomi delle squadre diversamente (come mostrato nell'esempio) e così via.
Se ci sono dubbi o problemi nell'implementazione, domanda pure.
-- 
There is no emotion; there is peace.
There is no ignorance; there is knowledge.
There is no passion; there is serenity.
There is no death; there is the Force. (Jedi Code)

 aver assegnato gli id ai tag che lo richiedono.
Ok, ho provato così ed in effetti funziona.
Prova adesso se ti va:
http://pialbo.altervista.org/calendarioa16squadre.htm
Grazie ancora.


 Se ci sono dubbi o problemi nell'implementazione, domanda pure.
Non sono riuscito a farlo funzionare :-(
Faccio una nuova pagina per provare:
http://pialbo.altervista.org/cal1.htm
Il css lo metto nell'head. Lo script lo metto dove mi pare. Il resto va 
nel body. Non funziona. Dove sbaglio?
Grazie per l'aiuto!


 Grazie per l'aiuto!
De nada.


 
http://pialbo.altervista.org/calendarioa16squadre.htm
firefox 1.5 tutto ok.
-- 
"Non sai che ci vuol scienza
 ci vuol costanza
 ad invecchiare senza maturità"
									    F.G.

 Leggi su, e fammi sapere se va.
Ok, va!
prova a vedere che effetto che fa quando apri la pagina con IE (e 
generi il calendario): nella lista ordinata i numeri romani più lunghi 
(tipo XIII., XIV., VIII., etc) si sovrappongono alla scritta invece di 
precederla (come correttamente fanno su FF):
http://pialbo.altervista.org/calendarioa16squadre.htm
Altra cosa: ovviamente copiando e incollando il calendario 
personalizzato generato (che è lo scopo del tutto) i numeri romani non 
vengono presi in considerazione... come invece vorrei che fosse. Anche 
qui non mi vengono in mente possibili soluzioni... :-(
Il copia e incolla viene:
# Giornata
    * kkkkkkkkkkk - kjh
    * lkj - hlk
    * jh - lkjh
    * lkj - hkj
    * hlk - jh
    * lkjh - klj
    * hlk - jh
    * kjh - lk


 vengono presi in considerazione... 
.. a te interessa avere i numeri romani nella clipboard, non solo a video o in
stampa. :) Quindi vanno messi come codice HTML. Da un lato si perde di
"flessibilità", ma è una flesisbilità che non credo t'interessi più di tanto
(ovvero la possibilità tramite CSS di eliminare i numeri rumani e sostituirli
con segnaposti, o numeri cardinali).
Già che ci sono ho aggiunto un metodo agli oggetti Number, per la decodifica
in numeri romani: in questo caso sarebbe bastato un array, ma si dice mai che
ti possa tornare utile in futuro.
<!-- inizio codice -->
<style type="text/css">
	div#calendario{
		font:bold 15px Trebuchet MS;		
		border:1px solid #e0e0e6;
		overflow:scroll;
		height:200px;
	}
	div#calendario ul{
		margin-top:0;
	}
	div#calendario li{
		list-style-type:none;
		font:bold 12px Trebuchet MS;
		color:#174068;
	}
</style>
<script type="text/javascript">
Number.prototype.toRoman = function () {
    var _r = 	[
		"M",1000,"CM", 900,"D", 500, "CD", 400, 
		"C", 100,"XC", 90,"L", 50, "XL", 40,
		"X", 10, "IX", 9, "V", 5, "IV", 4,"I", 1
		],
	n = this, i = 0, output = "";
    while ( n>0 ) {
        if ( n >= _r[i+1] ) {
            output += _r[i];
            n -= _r[i+1];
        } else {
            i += 2;
        }
    }
    return output;
}
var giornate = [
		[	0,1,
			2,3,
			4,5,
			6,7,
			8,9,
			10,11,
			12,13,
			14,15
		],
		[	11,6,
			13,2,
			15,8,
			7,10,
			1,14,
			3,4,
			9,12,
			5,0
		]
]
function creaCalendario(){
	var 	sHTML = "",
		squadre = document.getElementsByName("txtSquadre");
	for (var g =0;g<giornate.length;g++){
		sHTML += (g+1).toRoman()+". Giornata<ul>";
		for (var i = 0; i < giornate[g].length; i+=2){
			sHTML+="<li>"+squadre[giornate[g][i]].value+" -
"+squadre[giornate[g][i+1]].value+"</li>";
		}
		sHTML +="</ul>";
	}
	document.getElementById("calendario").innerHTML = sHTML;
}
</script>
<!-- qui ci sono i controlli input ed il pulsante di creazione -->
<div id="calendario"></div>
<!-- fine codice -->
Ho modificato il CSS, ho cambiato il tag contenitore da UL a DIV, e ovviamente
il codice js di conseguenza.
Se mi chiarisci il discorso sulla generazione delle giornate, si potrebbe
anche codificare l'algoritmo.


 anche codificare l'algoritmo.
Non c'è bisogno, diventerebbe troppo complicato senza aggiungere nulla 
di concreto.
Grazie ancora!


 Grazie ancora!
De nada.
-- 
~ "Viviamo nei vuoti lasciati da qualcun'altro."