Visualizzazione dei risultati da 1 a 2 su 2
  1. #1

    [JQUERY.VALIDATE] togliere il focus da un campo input

    Ciao Raga, urge aiutino
    sto cercando di capire se c'è un metodo che mi permette di pulire la validazione di un campo dipendente da un altro, spiego nel dettaglio:

    prendiamo in esempio 2 soli campi di input; "ragione_sociale" e "partita_iva"
    ho impostato una validazione che visualizzi un errore nel caso l'utente compili il campo "ragione sociale" a questo punto se non inserisce anche la P.IVA visualizza errore su questo input.

    Ok, funziona !
    Il problema adesso è che se l'utente cancella la ragione sociale, sparisce la label.error (va viene il messaggio di errore) ma mi rimane il contorno del campo input con la classe di errore, cioè con bordo rosso, spero di avere reso l'idea.

    Esiste un metodo che ripulisce il controllo del campo P.IVA se viene cancellato il contenuto del campo "ragione_sociale2 ?

    posto il codice come esempio:

    codice:
    $("#form").validate({
          rules: {    
                piva: {
                        required: function(element){
                             return $("#ragione_sociale").val() != '';
                        },                        
                  }
          },        
          messages: {
              piva: {
                  required:"Campo obbligatorio se compili il campo: Ragione Sociale"
              }
          }        
    });

    Qualcuno può aiutarmi ?

    Grazie mille

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,771
    Ciao, puoi fare in vari modi.

    Personalmente sono arrivato alla seguente soluzione:
    Per rendere non selezionabile il campo input si può usare l'attributo disabled.
    A quel punto, sull'oggetto del validate, si può specificare la proprietà ignore per ignorare i campi con tale attributo, così che non siano considerati durante la validazione.
    Per controllare se il contenuto di un campo input viene cancellato (quindi il campo risulta vuoto) si può usare l'evento change (in jQuery) che viene innescato dopo la perdita del focus se il contenuto è cambiato. Si può usare anche l'evento input, per avere un controllo immediato durante la digitazione dentro il campo.
    Nel callback, specificato per questi eventi, andranno effettuati dei controlli per impostare l'attributo disabled ed eseguire nuovamente la validazione sul campo interessato.

    Giusto un esempio per chiarire quanto ti ho indicato:
    codice:
    <!DOCTYPE HTML>
    <html>
      <head>
        <title>Esempio</title>
        <meta charset="utf-8">
        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script src="http://jqueryvalidation.org/files/dist/jquery.validate.min.js"></script>
        <style type="text/css">
          input.error{border-color:red;}
          label.error{color:red;}
        </style>
      </head>
      <body>
        <form id="form" method="get" action="#">
          <fieldset>
            <legend>Form validation with jQuery</legend>
            <p>
              <label>Ragione Sociale</label>
              <input id="ragione_sociale" name="ragione_sociale">
            </p>
            <p>
              <label>Partita IVA</label>
              <input id="piva" name="piva">
            </p>
            <p>
              <input type="submit" value="Submit">
            </p>
          </fieldset>
        </form>
        <script>
          $("#form").validate({
            rules: {    
              piva: {
                required: function(e){return $("#ragione_sociale").val()!=""}
              }
            }        
            ,messages: {
              piva: {
                required:"Campo obbligatorio se compili il campo: Ragione Sociale"
              }
            }
            ,ignore: ":hidden, :disabled"
          });
          $("#ragione_sociale").on("change input",function(e){
            var flag = this.value=='';
            if (flag) $("#piva").valid();
            $("#piva").prop('disabled', flag);
          }).change();
        </script>
      </body>
    </html>
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.