Visualizzazione risultati 1 fino 13 di 13

Discussione: Il bordino del campo sparisce e poi riappare

  1. #1
    Guest

    Predefinito Il bordino del campo sparisce e poi riappare

    Quando digito nel campo Nome il bordino che ho messo intorno sparisce, se poi digito nel campo Cognome il bordino riappare nel campo Nome, un po' strano…

    Il bordino dovrebbe rimanere sempre come nel campo Via, Piazza.

    Codice PHP:
    //Nome
    function nomeCampoG() {
    var
    f = document.forms.mioformG;
    if(
    f.nome.value == "") {
    document.getElementById('nomeCampoG').innerHTML = "•  Inserire il Nome";
    f.nome.focus();
    return
    false;
    }
    else {
    document.getElementById('nomeCampoG').innerHTML = "";
    }
    return
    true;
    }

    // Cognome
    function cognomeCampoG() {
    var
    f = document.forms.mioformG;
    if(
    f.cognome.value == "") {
    document.getElementById('cognomeCampoG').innerHTML = "•  Inserire il Cognome";
    f.cognome.focus();
    return
    false;
    }
    else {
    document.getElementById('cognomeCampoG').innerHTML = "";
    }
    return
    true;
    }

  2. #2
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    Gli input TAG hanno già un loro bordo ..
    e comunque il problema non credo che risieda nel JS
    forse dovresti postare anche la struttura HTML e gli stili CSS

  3. #3
    Guest

    Predefinito

    Il codice è uguale per i vari campi, cambia il nome ovviamente

    Codice PHP:
    <label class="nomiG">Nome<span class="asteriscoG">&nbsp;*</span></label>
    <
    input type="text" name="nome" class="campiG" value=" onkeyup="contaNomeG(); nomeCampoG()" onblur="nomeCampoG(); this.value=this.value.replace(/[\s]*/,'')">

    input.campiG {
    width: 190px;
    height: 20px;
    font-family: arial;
    font-size: 15px; color: #000;
    border: 1px solid #ccc;
    text-align: left;
    padding-left: 2px;
    }

  4. #4
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    Dal codice postato non emerge niente che faccia modificare border:1px solid #CCC;
    hai controllato con la console del browser gli stili , quali sono disabilitati e da cosa ...

    altrimenti puoi sempre reiterare lo stile nella funzione JS definendolo come !important

  5. #5
    Guest

    Predefinito

    Citazione Originalmente inviato da NLSweb Visualizza messaggio
    Dal codice postato non emerge niente che faccia modificare border:1px solid #CCC;
    hai controllato con la console del browser gli stili , quali sono disabilitati e da cosa ...

    altrimenti puoi sempre reiterare lo stile nella funzione JS definendolo come !important
    Ho messo borderColor ma non funge

    Codice PHP:
    function nomeCampoG() {
    var
    f = document.forms.mioformG;
    if(
    f.nome.value == "") {
    f.nome.style.borderColor='red'
    document.getElementById('nomeCampoG').innerHTML = "&bull;&nbsp;&nbsp;Inserire il Nome";
    f.nome.focus();
    return
    false;
    }
    else {
    document.getElementById('nomeCampoG').innerHTML = "";
    }
    return
    true;
    }

  6. #6
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    prova

    f.nome.style.border="1px solid red !important";

  7. #7
    Guest

    Predefinito

    Non funziona

  8. #8
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    La funzione viene eseguita all'uscita del campo input ?

    hai provato a dare un ID al tag input e richiamarlo direttamente ?

    document.getElementById("myTagInput").style.border ="1px solid #FF0000";

  9. #9
    Guest

    Predefinito

    Non è più semplice richiamare il css nell'onblur che richiama già il campo obbligatorio?

    ...onblur="nomeCampoG();'')">

    Così comunque non va

    Codice PHP:
    function nomeCampoG() {
    var
    f = document.forms.mioformG;
    if(
    f.nome.value == "") {
    document.getElementById('nomeCampoG').innerHTML = "&bull;&nbsp;&nbsp;Inserire il Nome";
    f.nome.focus();
    return
    false;
    }
    else {
    document.getElementById("campiG").style.border ="1px solid #FF0000";
    }
    else {
    document.getElementById('nomeCampoG').innerHTML = "";
    }
    return
    true;
    }
    Ultima modifica di gruppoalveo : 26-08-2014 alle ore 23.16.53

  10. #10
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    onblur viene attivato quando si seleziona il tag input
    il tuo problema è dopo che l'utente ha immesso il dato e cambia il campo , il bordino del nome scompare
    quindi per reiterare il CSS , conviene ridefinire lo style dopo che si esce dal campo (es. onchange,..)

  11. #11
    Guest

    Predefinito

    Citazione Originalmente inviato da NLSweb Visualizza messaggio
    onblur viene attivato quando si seleziona il tag input
    il tuo problema è dopo che l'utente ha immesso il dato e cambia il campo , il bordino del nome scompare
    quindi per reiterare il CSS , conviene ridefinire lo style dopo che si esce dal campo (es. onchange,..)
    Non va nemmeno con onchange. Però ho notato nel il bordino riappare quando nel campo successivo rilascio il tasto, non quando inizio a digitare.
    Ultima modifica di gruppoalveo : 27-08-2014 alle ore 11.34.14

  12. #12
    NLSweb non è connesso Altervistiano Junior
    Data registrazione
    17-01-2014
    Messaggi
    658

    Predefinito

    Prova ad usare il debug del browser per verificare il cambio di stile dell'elemento , dovrebbe evidenziarsi cosa lo disattiva..

  13. #13
    Guest

    Predefinito

    Citazione Originalmente inviato da NLSweb Visualizza messaggio
    Prova ad usare il debug del browser per verificare il cambio di stile dell'elemento , dovrebbe evidenziarsi cosa lo disattiva..
    Lo sto ancora sistemando in locale, non è ancora online

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •