Come faccio a cancellare MVC validazione lato client errori quando un pulsante annulla è scattato quando un utente ha invalidato un modulo?

Ho una visione parziale che viene visualizzato all’interno di una vista principale. Il parziale vista sfrutta System.ComponentModel.DataAnnotations e Html.EnableClientValidation().

Un link viene cliccato, e il div contenente il parziale vista viene visualizzato all’interno di un JQuery.Dialog().

Ho quindi fare clic sul pulsante salva senza inserire del testo nel mio convalidato campo di input. Questo provoca la validazione lato client a fuoco come previsto, e visualizzare il ‘necessario’ messaggio accanto al campo non valido.

Quando il pulsante annulla è cliccato, ho voglia di reimpostare il lato client MVC convalida torna al suo stato predefinito e rimuovere qualsiasi messaggio, pronto per quando l’utente apre la finestra di dialogo nuovo. C’è un modo consigliato di fare questo?

  • Fare clic sul pulsante Annulla respingere l’JQuery finestra di Dialogo che richiede di costruire uno nuovo quando l’utente fa clic sul pulsante Modifica. A quel punto, MVC convalida dovrebbe già essere al suo stato di default. Se non lo è (cioè il sottostante DOM oggetti associati con la finestra di dialogo contiene i dati dell’ultima finestra di Dialogo chiamata), il modo corretto è quello di semplicemente cancellare i valori da DOM oggetti.
InformationsquelleAutor Sci-fi | 2010-05-09

 

8 Replies
  1. 46

    Questa risposta è per MVC3. Vedere i commenti qui sotto per aiutare l’aggiornamento a MVC 4 e 5

    Se si desidera eliminare la validazione dei messaggi, in modo che essi non sono indicati per l’utente che si può fare con javascript in questo modo:

    function resetValidation() {
            //Removes validation from input-fields
            $('.input-validation-error').addClass('input-validation-valid');
            $('.input-validation-error').removeClass('input-validation-error');
            //Removes validation message after input-fields
            $('.field-validation-error').addClass('field-validation-valid');
            $('.field-validation-error').removeClass('field-validation-error');
            //Removes validation summary 
            $('.validation-summary-errors').addClass('validation-summary-valid');
            $('.validation-summary-errors').removeClass('validation-summary-errors');
    
        }

    Se avete bisogno di reset, per funzionare solo nel popup che si può fare in questo modo:

    function resetValidation() {
            //Removes validation from input-fields
            $('#POPUPID .input-validation-error').addClass('input-validation-valid');
            $('#POPUPID .input-validation-error').removeClass('input-validation-error');
            //Removes validation message after input-fields
            $('#POPUPID .field-validation-error').addClass('field-validation-valid');
            $('#POPUPID .field-validation-error').removeClass('field-validation-error');
            //Removes validation summary 
            $('#POPUPID .validation-summary-errors').addClass('validation-summary-valid');
            $('#POPUPID .validation-summary-errors').removeClass('validation-summary-errors');
    
        }

    Spero che questo è l’effetto che si cerca.

    • Grazie per la risposta. Io avevo realizzato una soluzione simile, ma espone un ulteriore problema, che quando il pulsante annulla è selezionata, la casella di testo perde fuoco, gli incendi e la convalida di nuovo! Si finisce per vedere il messaggio di errore visualizzato prima della chiusura della finestra di dialogo. L’unico modo che può finire per risolvere questo problema è iniettando il dialogo nel div utilizzando JQuery.Chiamata Ajax per ottenere il parziale vista DIV utilizzato da comparsa. In questo modo, quando la finestra è chiusa, la ‘persistenza’ è perso.
    • Non è che puoi disattivare la casella di testo prima di chiamare il “reset”-funzione? O mi manca qualcosa nella tua configurazione?
    • Ho usato questo metodo in un MVC 4 app, ma ha lasciato gli errori di validazione visualizzato. L’aggiunta di $('.validation-summary-errors li').remove(); al top del metodo risolto il problema.
    • In MVC5 convalida messaggio di testo è stato ancora visualizzato, ho avuto modo chiaro con $('.field-validation-error').text('');
  2. 16

    Se si utilizza discreto di convalida che viene fornito con MVC si può semplicemente fare:

    $.fn.clearErrors = function () {
        $(this).each(function() {
            $(this).find(".field-validation-error").empty();
            $(this).trigger('reset.unobtrusiveValidation');
        });
    };

    ————————————————————————

    Di Terzi Modifica:
    Questo lavorato soprattutto nel mio caso, ma ho dovuto rimuovere il $(this).find(".field-validation-error").empty(); linea. Questo sembrava influenzare la ri-mostra i messaggi di validazione quando reinvio.

    Ho usato il seguente:

    $.fn.clearErrors = function () {
            $(this).each(function() {
                $(this).trigger('reset.unobtrusiveValidation');
            });
        };

    e poi ha chiamato come questo:

    $('#MyFormId input').clearErrors();
  3. 1

    Grazie. Ho avuto un simile domanda per uno scenario leggermente diverso. Ho una schermata in cui quando si fa clic su uno dei pulsanti di invio il download di un file. In MVC quando si ripristina un file per il download, non cambiare schermo, in modo che eventuali messaggi di errore che erano già presenti nel sommario di convalida rimanere lì per sempre. Io di certo non si desidera che i messaggi di errore di rimanere lì dopo che il modulo è stato inviato di nuovo. Ma anche io non voglio sgombrare il campo a livello di convalide che sono catturati sul lato client quando invia pulsante. Inoltre, alcuni dei miei punti di vista hanno più di una forma su di loro.

    Ho aggiunto il seguente codice (grazie a voi) nella parte inferiore del Sito.Master pagina, in modo che esso si applica a tutti i miei punti di vista.

        <!-- This script removes just the summary errors when a submit button is pressed 
        for any form whose id begins with 'form' -->
    <script type="text/javascript">
        $('[id^=form]').submit(function resetValidation() {
            //Removes validation summary
            $('.validation-summary-errors').addClass('validation-summary-valid');
            $('.validation-summary-errors').removeClass('validation-summary-errors');
        });
    </script>

    Grazie ancora.

    • Ora, un anno dopo, e ho aggiornato il progetto per VS 2010, MVC3 e Rasoio. Per qualche motivo MVC3 non inserisce “id=’form0′” tag quando si utilizza HTML.BeginForm() funzione di supporto per impostazione predefinita. Si dovrebbe fare un nuovo { id = ‘form0″ } in Html.BeginForm(). O è necessario impostare ClientValidationEnabled di vero e impostare UnobtrusiveJavaScriptEnabled false. Quello che ho finito per fare è modificare il selettore di jQuery per il solo lavoro di qualsiasi forma di tag come segue “$(‘form’).submit(function resetValidation() {“
  4. 1

    Si può attingere la convalida di metodi di libreria per fare questo.
    Ci sono due oggetti di interesse: FormContext e FieldContext. È possibile accedere FormContext tramite il modulo __MVC_FormValidation proprietà, e uno FieldContext per validato proprietà tramite il FormContext‘s fields proprietà.

    Così, per cancellare gli errori di validazione, si può fare qualcosa di simile a un form:

    var fieldContexts = form.__MVC_FormValidation.fields;
    for(i = 0; i < fieldContexts.length; i++) {
        var fieldContext = fieldContexts[i];
        //Clears validation message
        fieldContext.clearErrors();
    }
    //Clears validation summary
    form.__MVC_FormValidation.clearErrors();

    Quindi, è possibile collegare quel pezzo di codice a seconda di quale evento di cui hai bisogno.

    Fonti per questo (abbastanza privi di documenti) approfondimento:

  5. 0

    Per completare chiara la convalida manufatti compreso il messaggio, il colore di sfondo del campo di input, e il colorato contorno l’ingresso in campo, ho bisogno di utilizzare il codice riportato di seguito, dove questo è stato (nel mio caso) un Bootstrap modale finestra di dialogo contenente un radicato forma.

    $(this).each(function () {
        $(this).find(".field-validation-error").empty();
        $(this).find(".input-validation-error").removeClass("input-validation-error");
        $(this).find(".state-error").removeClass("state-error");
        $(this).find(".state-success").removeClass("state-success");
        $(this).trigger('reset.unobtrusiveValidation');
    });
  6. 0

    Qui potete semplicemente rimuovere il messaggio di errore

    $('.field-validation-valid span').html('')

    O

      $('.field-validation-valid span').text('')

    Come faccio a cancellare MVC validazione lato client errori quando un pulsante annulla è scattato quando un utente ha invalidato un modulo?

  7. 0

    Si può semplicemente definire una nuova funzione in jQuery:

    $.fn.resetValidation = function () {
        $(this).each(function (i, e) {
            $(e).trigger('reset.unobtrusiveValidation');
            if ($(e).next().is('span')) {
                $(e).next().empty();
            }
        });
    };

    e quindi utilizzarlo per i campi di input:

    $('#formId input').resetValidation();

Lascia un commento