Newsgroup: it.comp.lang.javascript
Titolo: Modificare colore cella

Ciao a tutti, mi trovo a dover affrontare un problema che non so risolvere.
Avevo già postato tempo fa riguardo un problema simile che, grazie al vostro
aiuto, sono riuscito a risolvere.
Ora però mi trovo a dover affrontare un altro scoglio alquanto ostico, visto
che di javascript non ne so quasi nulla...
Praticamente ho una serie di 10 checkbox all'interno di un form html
(inserito in una pagina php)
Successivamente ho una cella all'interno di una tabella in cui è contenuto
un numero che passo dinamicamente con php.
Quello che vorrei ottenere è che:
- se il numero di checkbox selezionate è inferiore al numero contenuto nella
cella lo sfondo resta bianco
- se il numero di checkbox selezionate è uguale al numero contenuto nella
cella lo sfondo diventa verde
- se invece il numero di checkbox selezionate è superiore al numero nella
cella lo sfondo diventa rosso
Sapete aiutarmi?
Grazie mille a tutti,
Ken

 cella lo sfondo resta bianco
Contiamo le checkbox selezionate (alla function passare come parametro la
form, che sarà document.forms[0])
function Conta(f) {
  var conteggio=0;
  for(var i=0;i<f.elements.length;i++)
   if(f.elements[i].type=="checkbox"&&f.elements[i].checked)
   conteggio++;
  return conteggio;
 }
e leggiamo questo numero:
 var NumeroInCella=parseInt(GetRef('MiaCella').innerHTML,10);
Da qua in poi hai quindi entrambi i numeri, ti basta confrontarli e di
conseguenza colorare lo sfondo della cella, es.
 GetRef("MiaCella").style.backgroundColor="red";
Prova un po' e posta il risultato.
-- 
"Emancipate yourselves from mental slavery;
None but ourselves can free our minds"
									    B.M.

  GetRef("MiaCella").style.backgroundColor="red";
Io continuo a dire che la nomenclatura della funzione che prendesti da me :P è
errata; sia per lo standard js sia perché crea confusione con l'omonima
funzione GetRef... riporterei quantomeno la "g" iniziale minuscola.
-- 
~ It may be that the old astrologers had the truth exactly reversed,
when they believed that the stars controlled the destinies of men.
The time may come when men control the destinies of stars.
(Arthur C. Clarke)

 funzione GetRef... riporterei quantomeno la "g" iniziale minuscola.
troppo tardi, la ho usata e la hanno usata dappertutto così ... rimuovo il
tuo riferimento? (c'è un tuo riferimento? non ho controllato ma penso di
sì).
Se vuoi la riscrivo da zer0 (eh eh), ma sinceramente non saprei in che
altro modo scriverla ... ossia, non è che fa giochetti chissà che strani, è
abbastanza basilare non trovi? Vero che la ho presa da un tuo post, ma vero
che è veramente basilare, non è un giochetto con commenti condizionali,
prototype con hackeraggi strani o altro ... ossia, è una function veramente
semplice e basilare.
-- 
"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.

 abbastanza basilare non trovi?
Si, infatti. L'unica cosa in più è l'associazione dello style per NS4.x, anche 
quella una banalità però all'epoca non era stata presa in considerazione da
molti.
Ma dato che la paternità è ugualmente mia :) E che l'hai presa da 
me, vorrei solo che fosse usata nella sua forma almeno sul NG e sul sito.
Poi internamente tu puoi utilizzarla come meglio ti aggrada, per carità, non 
ho intenzione di modificare le tue abitudini; e di certo tu non farai 
confusione con funzioni omonime.
Al massimo ti ripeto il consiglio sulla nomenclatura, ma se sta bene a te e 
finché non lavori a più mani, puoi utilizzare anche quella di Visual Basic per 
JS.
-- 
~ L'ingegnere non vive, funziona.

 almeno sul NG.
Ho capito quello che dici, ma io uso e userò sempre GetRef. Se la cambio
poi so già che continuerò in questo newsgroup a indicare il link e poi "per
usarlo GetRef(...)", dopodiché "non funziona" e io "acc scusa javascript è
case-sensitive" etc etc, mi conosco, in intranet e siti web dovrei
continuare ad usare GetRef e non mi ricorderò mai di cambiarla per il
newsgroup.
Se vuoi inserisco questo tuo appunto nella pagina.
-- 
"e mai che mi sia venuto in mente
 di essere più ubriaco di voi
 di essere molto più ubriaco di voi"
									  F.D.A.

 Ti ripeto, è errata sia per nomenclatura 
Cosa vuol dire "per lo standard js la nomenclatura della funzione
è errata "?

 è errata "?
Perché in js si utilizza la stessa nomenclatura di java.
Serve a rendere il codice più comprensibile già ad una prima lettura, 
esattamente come fa la notazione ungherese.
Nel caso specifico, una classe inizia con la lettera maiuscola, mentre 
variabili, metodi e proprietà iniziano sempre con lettere minuscole.
Esempio:
	var myArray = new Array();
Array è una "classe", non un'istanza, quindi ha la prima lettera maiuscola; a 
differenza di myArray.
Stesso discorso dicasi per le funzioni e metodi:
	myArray.sort();
 
e non:
	myArray.Sort();
così come:
	alert("hello world");
e non:
	Alert("hello world");
Ovviamente non tutti i linguaggi seguono la stessa nomenclatura, ad esempio 
Visual Basic preferisce la lettera maiuscoma anche per funzioni (GetRef, 
appunto).
Non è che ce ne sia una migliore oggettivamente, dipende dai gusti personali 
alla fin fine, ma quello che si dovrebbe evitare sempre di fare è mischiare 
nomenclature diverse.
Ogni linguaggio ha la sua nomenclatura predefinita, usata per definirne le 
funzioni e oggetti "core", e si dovrebbe continuare a usare quella.
-- 
~ Chi segue gli altri, non arriva mai primo.

 newsgroup.
Puoi almeno fare un tentativo; tanto lo sai che ci sono qua io che ti riprendo
nell'eventualità che tu lo faccia. :P


 nell'eventualità che tu lo faccia. :P
Ok, ci penso ... il problema è che anche il sito è pieno di esempi da
scaricare con la GetRef. Devo mettere mano al sito perché vorrei inserire
una cosetta, giurin giureta appena riesco te la sistemo da GetRef a getRef.
-- 
"Ho smesso di fumare.
 Vivrò una settimana di più.
 E in quella settimana pioverà a dirotto"
									    W.A.

 esattamente come fa la notazione ungherese.
...
Grazie e gentile come al solito


http://groups.google.it/group/it.comp.lang.javascript/browse_thread/thread/7
143f4870d7270c4/58a10511d1440ae1
Giuro che prima di postare sui NG faccio una bella ricerchina su google
gruppi!   ;-)
Ho cercato ma non ho trovato niente... grazie mille per le dritte, ora provo
a smanettarci un pò e vedere se riesco a farci saltare fuori qualcosa.
Probabilmente vi romperò nuovamente le scatole dal momento che di javascript
ne so zero.
Ciao e grazie,
Ken

 Prova un po' e posta il risultato.
Ragazzi grazie a tutti per l'aiuto! Ho ancora un piccolo problema da
sistemare ma ora sembra funzionare.
Mi ero anche dimenticato (come mi avete fatto notare) che avevo postato
praticamente la stessa domanda qualche mese fa, che patacca...
Questo è quello che ho fatto in base anche ai suggerimenti dell'altra volta:
<script type='text/javascript'>
function conteggio( sender ){
        var     obj=document.getElementById('idcella');
        iCount=parseInt(obj.firstChild.nodeValue,10)+(sender.checked?1:-1);
        obj.firstChild.nodeValue=iCount;
        obj.style.backgroundColor=(iCount == 3 )?'lightgreen':'orange';
}
</script>
Nella cella interessata poi ho scritto:
<td id='idcella' bgcolor=lightgreen>3</td>
Infine nelle checkbox ho inserito questo:
<input type=checkbox name='c1' onclick='conteggio(this);'>
Tutto funziona, l'unico problema che ho è che il numero nella cella viene
modificato in base a quante checkbox vengono selezionate/deselezionate.
Io vorrei che rimanesse sempre quello (nell'esempio che ho fatto è 3)
Ultima cosa, lo script viene lanciato ogni volta che si
seleziona/deseleziona una casella, ma non al caricamento della pagina.
Esiste il modo per effettuare un controllo subito appena la pagina viene
caricata?
Grazie,
Ken

 caricata?
Visto che usi le variabili globali, creane una, da inizializzare poi al
caricamento della pagina (onload), che memorizzi il riferimento alla cella
della tabella, così non fai ogni volta getElementById. Poi, il valore nella
cella della tabella cambia perché gli dici tu di cambiare, con l'istruzione
  obj.firstChild.nodeValue=iCount
Infine, per quanto riguarda l'esecuzione dello script al caricamento della
pagina, devi inserire qualcosa all'interno dell'handler dell'evento load
(onload)... e ti serve la funzione che ha scritto Cristiano, perché non
puoi riferirti solo ad una checkbox, ma devi contarle tutte (NB usa proprio
la funzione di Cristiano... magari chiamala conta(), con la "c" minuscola
:-)).
Riassumendo:
<script type="text/javascript">
// Variabili globali
var objTableCell=null,objForm=null,refValue=0,nowChecked=0;
// Funzioni
function setBackground() {
  objTableCell.style.backgroundColor = ( nowChecked>refValue?'red':(
nowChecked<refValue?'orange':'green' ) );//Tutto su una riga!!!
  };
function conta() {
    for(var cont=0,i=0,n=objForm.elements.length;i<n;i++)
      if (objForm.elements[i].type=="checkbox" &&
objForm.elements[i].checked) cont++;//Tutto su una riga!!!
  return cont;
  };
function conteggio( sender ){
  nowChecked+=(sender.checked?1:-1);
  setBackground();
  //Le due istruzioni di sopre si possono riscrivere in forma compatta:
  //  setBackground(nowChecked+=(sender.checked?1:-1));
  };
// Al caricamento della pagina
window.onload=function() {
  objTableCell=document.getElementById('idcella');
  objForm=document.forms['nomeDellaFormContenenteLeCheckbox'];
    //Qui sopra mettici il nome della form che contiene le checkbox!!!
  refValue=parseInt(objTableCell.firstChild.nodeValue,10);
  nowChecked=conta();
  setBackground();
  //Le due istruzioni di sopre si possono riscrivere in forma compatta:
  //  setBackground(nowChecked=conta());
  };
</script>
PS(1): la funzione setBackground imposta il background della cella:
-arancione se numero di checkbox spuntate<valore nella cella della tabella
-verde se numero di checkbox spuntate=valore nella cella della tabella
-rosso se numero di checkbox spuntate>valore nella cella della tabella
PS(2): ho assunto che il valore nella cella della tabella non debba essere
modificato; se così non è, il valore della variabile refValue deve essere
ricalcolato ogni volta
PS(3): forse il tutto si potrebbe anche riscrivere evitando tutte quelle
variabili globali...
Prova un po', adattalo alle tue esigenze e fammi sapere se ho scritto
qualche fesseria :)
-- 
Nando [?]
Ex-Apostolo della Ex-Prova

 qualche fesseria :)
Grazie, ora ci smanetto un pò!
Ken

Ken <od...@lo.spam> ha scritto:

Figurati, spero ti sia utile... e non dimenticare di farmi sapere, sto
imparando pure io :)


 qualche fesseria :)
Quali fesserie, lo script funziona alla perfezione.
Il codice che hai realizzato è stato pensato per funzionare per un intero
form al quale diamo come id lo stesso che poi passeremo a
objForm=document.forms['form1'];
Il problema non sorge se io ho una singola riga con N checkbox (tutte nel
form1)
Ma se io avessi all'interno di form1 diverse righe ognuna da N checkbox?
Avrei la necessità di effettuare questo controllo per ogni singola riga e
non per l'intero form...
Ho provato a paciugarci sopra cercando di aggirare il problema con <DIV
id='form1'>, <DIV id='form2'> ecc.. ecc..
ma non ho ottenuto nessun risultato funzionante.
Ho inoltre fatto altri innumerevoli tentativi cercando di trovare la
soluzione ma sembra proprio che il tuo script funzioni *solo* se utilizzato
con <form id='form1'>, <form id='form2'> ecc.. ecc..
Ora provo a riguardarci di nuovo ripartendo da zero, se ti vengono idee sono
sempre quà!
Grazie,
Ken

 non per l'intero form...
Uè Ken, e le cose dille tutte insieme, non un pezzettino alla volta :-)
Non capisco una cosa, però... ad ogni gruppo di checkbox è associata una
cella di tabella? Oppure vi è una sola cella, e quindi un solo numero di
riferimento valido per tutti i gruppi di checkbox?
Vabbè, ci si pensa domani, magari... ora ho troppo sonno -__^


 Vabbč, ci si pensa domani, magari... ora ho troppo sonno -__^
Buon riposo, io invece vado a mangiare che per stare dietro a questo
inghippo ho saltato la cena...
Ciauz!
Ken

"Ken" <od...@lo.spam> ha scritto nel messaggio
news:FeBxf.125611$65.35...@twister1.libero.it...
[CUT]
Ore 6 e 30 del mattino... lavoro finito!   ;-)
Vi ringrazio a tutti, è stata una lunga maratona ma tutto sommato
divertente, alla fine la cosa più bella è essere riusciti a fare ciò che si
voleva...
Ho risolto tutti i problemi facendo delle modifiche sostanziali a tutta la
struttura della tabella.
Ora non ho più le checkbox ma:
<select name='L1' onchange='coloreL1"(this);'>
<option...
<option...
Ogni volta che si seleziona un valore dal select viene richiamata la
funzione coloreL1
var refValue1= "variabile_dal_php";
var ndcl1 = ".variabile_dal_php.";
function coloreL1( sender ){
  obj=document.getElementById('cella1');
  if (sender.value == '0'){ refValue1++; ndcl1 = 1;}
  if (ndcl1 == '1' && sender.value != '0'){ refValue1--; ndcl = 0;}
        obj.style.backgroundColor=(
refValue>".variabile_dal_php."?'orangered':(
refValue1<".variabile_dal_php."?'orange':'lightgreen' ) );
}
Il fatto che venga richiamata la funzione appena si apre la finestra non
l'ho risolto ma sono riuscito comunque ad aggirare il problema utilizzando
il php.
Dal momento che è il php stesso che passa le variabili allo script js,
anzichè far partire gli script all'apertura della pagina ho pensato di
effettuare tutti i controlli iniziali direttamente dal php che mi formatta
la pagina (i colori) correttamente.
Poi, per ogni evento (onchange) ci pensa a tutto lo script js.
Ragazzi, grazie a tutti per la disponibilità!
Sono sicuro però che ci risentiremo molto presto...   ;-)
Ciao,
Ken
PS: ora che ho avuto un approccio (seppur marginale) con il javascript devo
ammettere che è molto divertente... incasinato ma divertente!

 ammettere che è molto divertente... incasinato ma divertente!
Mi fa piacere che tu abbia concluso :)
Mi permetto solo di darti un consiglio per il futuro: prima di mettere mano
al codice, cerca di definire nella maniera più precisa e dettagliata
possibile "cosa" deve essere fatto (analisi); solo successivamente passa al
codice... Può sembrare una perdita di tempo mentre, invece, di tempo te ne
fa risparmiare un casino e ti porta a scrivere codice molto più pulito e,
di conseguenza, molto più facilmente manutenibile. E javascript ti apparirà
meno "incasinato" e ancor più divertente :)
