Richiamare 2 getElementById uguali

14-09-2012, 20.24.09

Sono quasi alla fine, si tratta ora di richiamare in 2 punti diversi, 2 getElementById diversi.

Il problema però è che le funzioni hanno gli stessi campi, funziona tutto, però ora devo usare un solo richiamo per 2 funzioni diverse, io invece ho bisogno di usare 2 richiami da mettere in 2 punti diversi nel form

Funzione-1

Codice PHP:


function parolaNo() { 
  var modulo = document.forms.mioform1;
  var parole = /b(<?php echo $paroleProibite; ?> )b/i; 
  var nomiCampi = ["nome","citta","messaggio"];
  for (idCampo = 0; idCampo < nomiCampi.length; idCampo++) {
    var campo = modulo.elements[nomiCampi[idCampo]];
    if (parole.test(campo.value)) {
      campo.style.borderColor = 'black'
      campo.style.backgroundColor = '#d8ecff'
      document.getElementById(''+nomiCampi[idCampo]).innerHTML = "&bull;&nbsp;&nbsp;La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa";
      campo.focus();
      return false;
    }
    else {
      document.getElementById(''+nomiCampi[idCampo]).innerHTML = "";
    } 
  }
  return true;
}

Funzione-2

Codice PHP:


function caratteriNo() {
  var fx = document.forms.mioform1;
  var nomeCampi = ["nome","citta","suoemail","messaggio","validator"];
  for (j=0;j<nomeCampi.length;j++) { 
    i=nomeCampi[j];
    var error = false;
    if (fx[i].value.indexOf("<")  != -1) {
      error = true;
    }
    if (fx[i].value.indexOf(">")  != -1) {
      error = true;
    }
    if (fx[i].value.indexOf("\\")  != -1) {
      error = true;
    }
    if (error) {
      fx[i].style.borderColor = 'black'
        fx[i].style.backgroundColor = '#d8ecff'
        document.getElementById(''+[i]).innerHTML = "&bull;&nbsp;&nbsp;I caratteri < > \\  non sono ammessi";
      fx[i].focus();
      return false;
    } 
    else {
      document.getElementById(''+[i]).innerHTML = "";
    }
  }
  return true;
}

richiamo per entrambi, in questo esempio per il campo nome

Codice PHP:


<div id="nome"></div>

Ho provato questo come secondo richiamo ma non va

Codice PHP:


<div id="nome[i]"></div>

**dreadnaut** · 14-09-2012, 22.47.09

Uhm, non si capisce molto bene cosa tu voglia fare, la spiegazione è un po' confusionaria

Hai una pagina di esempio online?

14-09-2012, 22.53.45

Originalmente inviato da dreadnaut

Uhm, non si capisce molto bene cosa tu voglia fare, la spiegazione è un po' confusionaria

Hai una pagina di esempio online?

http://www.bellezzalive.altervista.org/# + Contatti

Se nel campo Nome scrivi mela e poi aggiungi un carattere proibito < (o viceversa) noterai che la frase rossa di alert cambia.

Questo perché ho 2 funzioni con il richiamo <div id="nome"></div>.

Io ho bisogno di creare 2 richiami e spostarli in modo indipendente

**dreadnaut** · 14-09-2012, 23.03.53

Ripeto, non si capisce cosa tu voglia fare. Devi raccontarci

cosa vuoi che succeda
cosa hai scritto (che in effetti è il tuo primo post)
cosa avviene invece e perché è un problema

Inoltre "creare due richiami" e "spostarli in modo indipendente" purtroppo non sono termini che hanno a che fare con javascript, quindi anche li dovresti spiegarti meglio.

Poi, per curiosità mia, perché devi bloccare quei caratteri? Non ti stai complicando la vita per qualcosa di arbitrario?

**alemoppo** · 14-09-2012, 23.09.02

forse vuoi che si mantengano le scritte in modo "separato"? Cioè, prima appare "il testo mela non è consentito", e poi si aggiunge "< è un carattere non ammesso"?

Se è così, invece delle

Codice:

document.getElementById().innerHTML = 'testo';

metti:

Codice:

document.getElementById().innerHTML += 'testo';

In modo di aggiungere gli elementi, e non sostituirli.

(p.s: ovviamente poi ci va anche un <br> dopo ogni testo, o comunque un separatore...)

EDIT: ovviamente i

Codice:

document.getElementById().innerHTML = "";

vanno bene così, altrimenti con il += sarebbe inutile

.

Ciao!

14-09-2012, 23.11.10

Originalmente inviato da dreadnaut

Ripeto, non si capisce cosa tu voglia fare. Devi raccontarci

cosa vuoi che succeda
cosa hai scritto (che in effetti è il tuo primo post)
cosa avviene invece e perché è un problema

Inoltre "creare due richiami" e "spostarli in modo indipendente" purtroppo non sono termini che hanno a che fare con javascript, quindi anche li dovresti spiegarti meglio.

Poi, per curiosità mia, perché devi bloccare quei caratteri? Non ti stai complicando la vita per qualcosa di arbitrario?

Quelle parentesi potrebbero contenere uno script, è meglio bloccarle.

La situazione è semplice, come avrai notato, gli alert appaiono in rosso sotto il campo Nome; se io volessi far aprire l'alert dei caratteri proibiti in un altro punto del form non posso perché ho un solo richiamo per le 2 funzioni ed è per quello che i 2 alert appaiono entrambi nello stesso punto del form

EDIT:

Originalmente inviato da alemoppo

forse vuoi che si mantengano le scritte in modo "separato"? Cioè, prima appare "il testo mela non è consentito", e poi si aggiunge "< è un carattere non ammesso"?

Se è così, invece delle

Codice:

document.getElementById().innerHTML = 'testo';

metti:

Codice:

document.getElementById().innerHTML += 'testo';

In modo di aggiungere gli elementi, e non sostituirli.

(p.s: ovviamente poi ci va anche un <br> dopo ogni testo, o comunque un separatore...)

EDIT: ovviamente i

Codice:

document.getElementById().innerHTML = "";

vanno bene così, altrimenti con il += sarebbe inutile

.

Ciao!

Adesso ci provo, se ci fai caso prova a digitare nel campo Nome mela (o un carattere proibito) fino a 20 caratteri vedrai uscire un altro alert, questo perché sono 2 richiami indipendenti e me li son messi nel punto dove volevo

**dreadnaut** · 14-09-2012, 23.21.45

Puoi, anzi devi comunque bloccare quei caratteri lato server, e puoi farlo ad esempio con una singola chiamata ad htmlspecialchars(). Controllare solo via javascript è insicuro, e finisci per disturbare i tuoi utenti per nulla.

Per far apparire più messaggi devi parametrizzare la funzione, passandogli come parametri il campo da controllare e il nodo "contenitore" dove andare a scrivere l'eventuale messaggio di errore.

Fosse il mio sito però, butterei via il javascript e farei solo pulizia in php: gli utenti possono scrivere quello che vogliono, ma io pulisco il messaggio convertendo i caratteri pericolosi.

14-09-2012, 23.26.13

Originalmente inviato da dreadnaut

Puoi, anzi devi comunque bloccare quei caratteri lato server, e puoi farlo ad esempio con una singola chiamata ad htmlspecialchars(). Controllare solo via javascript è insicuro, e finisci per disturbare i tuoi utenti per nulla.

Per far apparire più messaggi devi parametrizzare la funzione, passandogli come parametri il campo da controllare e il nodo "contenitore" dove andare a scrivere l'eventuale messaggio di errore.

Fosse il mio sito però, butterei via il javascript e farei solo pulizia in php: gli utenti possono scrivere quello che vogliono, ma io pulisco il messaggio convertendo i caratteri pericolosi.

Chiaramente ho anche il php che blocca, ma è sempre meglio avvisare subito con js l'utente. Riguardo alla modifica, cosa faccio in pratica?

**alemoppo** · 14-09-2012, 23.28.56

Originalmente inviato da photoman

in un altro punto del form

Dove? Se è tutto da un'altra parte, devi usare un nuovo contenitore (con proprio id).

Hai provato con += ? Non va bene?

Ciao!

14-09-2012, 23.31.28

Originalmente inviato da alemoppo

Dove? Se è tutto da un'altra parte, devi usare un nuovo contenitore (con proprio id).

Ciao!

Ma è proprio questo quello che sto cercando di spiegare e di fare

**dreadnaut** · 14-09-2012, 23.35.02

Originalmente inviato da photoman

Chiaramente ho anche il php che blocca, ma è sempre meglio avvisare subito con js l'utente. Riguardo alla modifica, cosa faccio in pratica?

No, non è meglio: sei tu che non vuoi vedere certi caratteri, quindi il problema è tuo, non dell'utente. Per questo ti proteggi con htmlspecialchars, ma non c'è nessun motivo di creare una complicazione aggiuntiva per il visitatore.

In pratica, quando chiami la funzione che controlla il contenuto di un campo, gli passi il campo stesso come parametro, assieme al nodo da riempire con il testo:

Codice HTML:

<input name="nome" onchange="controlla(this, document.getElementById('msg-nome')))" />
<span id="msg-nome"></span>

...

<script type="text/javascript">
function controlla(campo, messaggio)
{
  if ( campo.value = 'mela' /* vari controlli sul campo */ )
    messaggio.innerHTML = 'Aaaaah errore di cui non ti importa nulla ma te lo scrivo comunque!"
}

14-09-2012, 23.45.46

Originalmente inviato da dreadnaut

No, non è meglio: sei tu che non vuoi vedere certi caratteri, quindi il problema è tuo, non dell'utente. Per questo ti proteggi con htmlspecialchars, ma non c'è nessun motivo di creare una complicazione aggiuntiva per il visitatore.

In pratica, quando chiami la funzione che controlla il contenuto di un campo, gli passi il campo stesso come parametro, assieme al nodo da riempire con il testo:

Codice HTML:

<input name="nome" onchange="controlla(this, document.getElementById('msg-nome')))" />
<span id="msg-nome"></span>

...

<script type="text/javascript">
function controlla(campo, messaggio)
{
  if ( campo.value = 'mela' /* vari controlli sul campo */ )
    messaggio.innerHTML = 'Aaaaah errore di cui non ti importa nulla ma te lo scrivo comunque!"
}

Quei controlli li ho già, se guardi le 2 funzioni che ho messo nel primo post, per me c'è da modificare questa parte document.getElementById(''+[i]).innerHTML ="..." in modo che poi richiamo il div dove voglio

**dreadnaut** · 14-09-2012, 23.50.59

Ed io ti ho scritto di passarlo come parametro, e ti ho fatto un esempio a riguardo. Poi per qualcosa di inutile e che peggiorerà l'esperienza per i tuoi visitatori, non mi viene voglia di scriverti molto più codice di quello. Ho una coscienza

O magari chiama i nodi dove scrivi i messaggi qualcosa come id="msg-nome", id="msg-citta', e poi li puoi raggiungere con document.getElementById('msg' + nomecampi[ i ])

edit: oddio, scrivendolo qua sopra, forse ho infine capito cosa cercavi di fare nel primo post :sbonk: era solo questione di scrivere nomecampi[ i ] invece di [ i ].

Continuo però ad essere dell'idea che sia una cosa negativa.

15-09-2012, 00.07.52

Originalmente inviato da dreadnaut

Ed io ti ho scritto di passarlo come parametro, e ti ho fatto un esempio a riguardo. Poi per qualcosa di inutile e che peggiorerà l'esperienza per i tuoi visitatori, non mi viene voglia di scriverti molto più codice di quello. Ho una coscienza

O magari chiama i nodi dove scrivi i messaggi qualcosa come id="msg-nome", id="msg-citta', e poi li puoi raggiungere con document.getElementById('msg' + nomecampi[ i ])

edit: oddio, scrivendolo qua sopra, forse ho infine capito cosa cercavi di fare nel primo post :sbonk: era solo questione di scrivere nomecampi[ i ] invece di [ i ].

Continuo però ad essere dell'idea che sia una cosa negativa.

Ho provato anche così ma non cambia la situazione

document.getElementById(''+[i]).innerHTML = "•  I caratteri < > \\\\ non sono ammessi";

...

<div id=" nome[i]"></div>

**dreadnaut** · 15-09-2012, 00.12.48

No, hai provato una cosa diversa, che non so da dove arrivi. Ho scritto: chiama i nodi msg-nome e msg-citta, e raggiungili con document.getElementById('msg' + nomecampi[ i ]).

Codice HTML:

<input name="nome" onchange="..." />
<div id="msg-nome"></div>

<input name="citta" onchange="..." />
<div id="msg-citta"></div>

...

function controlla()
{
...

 document.getElementById('msg-' + nomecampi[i]).innerHTML = "Messaggio inutile all'utente"
}

15-09-2012, 00.21.24

Originalmente inviato da dreadnaut

No, hai provato una cosa diversa, che non so da dove arrivi. Ho scritto: chiama i nodi msg-nome e msg-citta, e raggiungili con document.getElementById('msg' + nomecampi[ i ]).

Codice HTML:

<input name="nome" onchange="..." />
<div id="msg-nome"></div>

<input name="citta" onchange="..." />
<div id="msg-citta"></div>

...

function controlla()
{
...

 document.getElementById('msg-' + nomecampi[i]).innerHTML = "Messaggio inutile all'utente"
}

Non va, forse sbaglio qualcosa:

<input type="text" onkeyup="caratteriNo()"...>

document.getElementById('msg-' + nomecampi[i]).innerHTML = "I caratteri < > \\\\ non sono ammessi";

<div id="msg-nome"></div>

**dreadnaut** · 15-09-2012, 00.44.30

Puoi postare il codice l'ultima versione della funzione ed un pezzo dell'html del form?

(domani magari, ora sonno)

15-09-2012, 00.57.09

Originalmente inviato da dreadnaut

Puoi postare il codice l'ultima versione della funzione ed un pezzo dell'html del form?

(domani magari, ora sonno)

Codice PHP:


function caratteriNo() {
var fx = document.forms.mioform1;
var nomeCampi = ["nome","citta","suoemail","messaggio","validator"];
for (j=0;j<nomeCampi.length;j++) { 
i=nomeCampi[j];
var error = false;
if (fx[i].value.indexOf("<")  != -1) {
error = true;
}
if (fx[i].value.indexOf(">")  != -1) {
error = true;
}
if (fx[i].value.indexOf("\\\\")  != -1) {
error = true;
}
if (error) {
fx[i].style.borderColor = 'black'
fx[i].style.backgroundColor = '#d8ecff'
document.getElementById('msg-' + nomecampi[i]).innerHTML = "I caratteri < > \\\\ non sono ammessi";
fx[i].focus();
return false;
} 
else {
document.getElementById(''+[i]).innerHTML = "";
}
}
return true;
}

Codice PHP:



<input type="text" name="nome"...onkeyup="caratteriNo()" onblur="caratteriNo();" />


<div id="msg-nome"></div>

**dreadnaut** · 15-09-2012, 01.11.43

Ah, mi ero confuso con i e j. Riscrivo sotto indentato che si capisce di più, e ripulito

Codice PHP:


function caratteriNo()
{
  var fx = document.forms.mioform1
  var nomeCampi = ['nome', 'citta', 'suoemail', 'messaggio', 'validator']
  for (var j=0; j < nomeCampi.length; j++)
  { 
    var i = nomeCampi[j]
    if ( (fx[i].value.indexOf("<")  != -1)
      || (fx[i].value.indexOf(">")  != -1)
      || (fx[i].value.indexOf("\\\\")  != -1) )
    {
      fx[i].style.borderColor = 'black'
      fx[i].style.backgroundColor = '#d8ecff'
      document.getElementById('msg-' + i).innerHTML = "I caratteri < > \\\\ non sono ammessi"  // cambiato nomecampi[i] in i
      fx[i].focus()  // questo crea problemi, lo toglierei
      return false
    } 
    else
      document.getElementById('msg-' + i).innerHTML = ""  // anche questo va cambiato '-.-
  }
  return true
}

15-09-2012, 01.19.07

Originalmente inviato da dreadnaut

Ah, mi ero confuso con i e j. Riscrivo sotto indentato che si capisce di più, e ripulito

Codice PHP:


function caratteriNo()

{

  var fx = document.forms.mioform1

  var nomeCampi = ['nome', 'citta', 'suoemail', 'messaggio', 'validator']

  for (var j=0; j < nomeCampi.length; j++)

  { 

    var i = nomeCampi[j]

    if ( (fx[i].value.indexOf("<")  != -1)

      || (fx[i].value.indexOf(">")  != -1)

      || (fx[i].value.indexOf("\\\\")  != -1) )

    {

      fx[i].style.borderColor = 'black'

      fx[i].style.backgroundColor = '#d8ecff'

      document.getElementById('msg-' + i).innerHTML = "I caratteri < > \\\\ non sono ammessi"  // cambiato nomecampi[i] in i

      fx[i].focus()  // questo crea problemi, lo toglierei

      return false

    } 

    else

      document.getElementById('msg-' + i).innerHTML = ""  // anche questo va cambiato '-.-

  }

  return true

}

Ho tolto il mio e messo questo ma non stampa niente

Discussione: Richiamare 2 getElementById uguali

LinkBack

Strumenti discussione

Display

Richiamare 2 getElementById uguali

Regole di scrittura