Aktualizacja podsumowania sprawdzania poprawności w czasie rzeczywistym

Question

Witam Używam MVC4 z walidacją po stronie klienta. Działa to doskonale, gdy wyświetlane są komunikaty sprawdzania poprawności obok pól.

Dodałem podsumowanie Walidacja:

@Html.ValidationSummary(false) 

To działa, po stronie klienta „n wszystko. Chciałbym jednak, żeby zachowywało się inaczej; obecnie wiadomości w podsumowaniu sprawdzania poprawności zmieniają się tylko po kliknięciu przycisku przesyłania. Chciałbym, aby były dynamiczne, wypełnione w podobny sposób do komunikatu walidacyjnego każdego pola.

Czy ktoś może zaproponować sposób osiągnięcia tego?

Wszelkie informacje na temat tego, co uruchamia aktualizację zbiorczą, byłyby świetne.

Answer 1

Wcześniej skonfigurować podsumowanie walidacji do aktualizacji w „czasie rzeczywistym” także z uwzględnieniem następujących:

1. zaktualizować podsumowanie tylko raz to widoczne (po stronie validate/submit)
2. Wyczyść podsumowanie, kiedy wszystko jest ważne

Niech wyodrębnić walidator, Zignorować showErrors() i wdrożyć naszą logikę:

var validator = $('form').data('validator'); 
validator.settings.showErrors = function (map, errors) { 
    this.defaultShowErrors(); 
    if ($('div[data-valmsg-summary=true] li:visible').length) { 
     this.checkForm(); 
     if (this.errorList.length) 
      $(this.currentForm).triggerHandler("invalid-form", [this]); 
     else 
      $(this.currentForm).resetSummary(); 
    } 
} 

Ponieważ używam tego rozwiązania dla całej mojej stronie stworzyłem następujące init (onReady):

$('form').each(function() { 
    var validator = $(this).data('validator'); 
    if (validator) { 
     validator.settings.showErrors = function (map, errors) { 
      this.defaultShowErrors(); 
      if ($('div[data-valmsg-summary=true] li:visible').length) { 
       this.checkForm(); 
       if (this.errorList.length) 
        $(this.currentForm).triggerHandler("invalid-form", [this]); 
       else 
        $(this.currentForm).resetSummary(); 
      } 
     }; 
    } 
}); 

A oto resetSummary stosowane powyżej:

jQuery.fn.resetSummary = function() { 
    var form = this.is('form') ? this : this.closest('form'); 
    form.find("[data-valmsg-summary=true]") 
     .removeClass("validation-summary-errors") 
     .addClass("validation-summary-valid") 
     .find("ul") 
     .empty(); 
    return this; 
}; 

Answer 2

Podsumowanie strony klienta wydaje się generowane po sprawdzeniu poprawności całego formularza i można to zrobić samodzielnie, wywołując metodę wtyczki valid(). Dodaj to po skryptach sprawdzania poprawności jquery.

<script> 
    $(function() { 
     $(':input').on("keyup click", function() { 
      $('form').valid(); 
     }); 
    }); 
</script> 

Przykładowe zdarzenia mam włączone są keyup i kliknij ale można dodać lub usunąć z tego miejsca listy rozdzielone.