jquery-validate - before - jquery validate messages



Inserimento di errori personalizzati plug-in di Jquery Validation (3)

Ho scoperto che usare .insertAfter piuttosto che .appendTo funziona:

jQuery.validator.setDefaults({
    errorPlacement: function(error, element) {
        error.insertAfter('#invalid-' + element.attr('id'));
    }
});

https://ffff65535.com

Utilizzo del plug-in jQuery Validation per il seguente modulo:

<form id="information" method="post" action="#">

            <fieldset>
                <legend>Please enter your contact details</legend>
                <span id="invalid-name"></span>
                <div id="id">
                    <label for="name">Name: (*)</label>
                    <input type="text" id="name" class="details" name="name" maxlength="50" />
                </div>

                <span id="invalid-email"></span>
                <div id="id">
                    <label for="email">Email: (*)</label>
                    <input type="text" id="email" class="details" name="email" maxlength="50" />
                </div>
            </fieldset>
            <fieldset>
                <legend>Write your question here (*)</legend>
                <span id="invalid-text"></span>
                <textarea  id="text" name="text" rows="8" cols="8"></textarea>


            <div id="submission">
                <input type="submit" id="submit" value="Send" name="send"/>
            </div>
            <p class="required">(*) Required</p>
            </fieldset>

             </form>

Come posso inserire gli errori nei tag span? (# nome non valido, # email non valida, # testo non valido)

Ho letto la documentazione sul posizionamento degli errori ma non ho capito come funziona. È possibile gestire ogni singolo errore e posizionarlo nell'elemento specificato?

Grazie


Puoi anche aggiungere manualmente etichette di errore nei luoghi che ti servono. Nel mio caso particolare avevo una forma più complessa con elenchi di caselle di controllo ecc. Dove un inserto o un inserto dopo rompevano il layout. Invece di fare ciò, puoi sfruttare il fatto che lo script di validazione valuterà se esiste un tag etichetta esistente per il campo specificato e lo usa.

Prendere in considerazione:

<div id="id">
    <label for="name">Name: (*)</label>
    <input type="text" id="name" class="details" name="name" maxlength="50" />
</div>

Ora aggiungi la seguente riga:

<label for="name" class="error" generated="true"></label>

che è un'etichetta di errore standard:

<div id="id">
    <label for="name">Name: (*)</label>
    <input type="text" id="name" class="details" name="name" maxlength="50" />
</div>
<div id="id-error">
    <label for="name" class="error" generated="true"></label>
<div>

jQuery utilizzerà questa etichetta anziché generarne una nuova. Spiacente, non sono riuscito a trovare alcuna documentazione ufficiale, ma ho trovato altri post che si sono imbattuti in questo comportamento.


Sto usando l'estensione dei metadati con il validatore .. (nota, lo sto impostando per usare l'attributo data-meta sul markup ...)

<input ... data=meta='{
    errorLabel: "#someotherid"
    ,validate: {
        name:true
    }
}' >

poi nel codice ...

jQuery.validator.setDefaults({
    errorPlacement: function(error, element) {
        error.appendTo($(
            $(element).metadata().errorLabel
        ));
    }
});

Sto usando i metadati per molte funzionalità simili, che funzionano piuttosto bene ... nota, ho usato i singoli tick (apostrofi) attorno ai meta dati, in questo modo è possibile utilizzare un serializzatore JSON lato server per iniettare in quella parte del tag (che dovrebbe usare doppie virgolette attorno alle stringhe) ... un apos letterale può essere un problema, però (sostituisci "'" con "\ x27" nella stringa).





jquery-validate