Jquery-Validierung - show Validierung Zusammenfassung während eifrig Validierung?

Ist es möglich jquery Validierung, um zu zeigen, die Validierung Zusammenfassung über eifrig Validierung?

Ich bin mit MVC 3 (wenn es kommt) und meine Formulare validieren, wenn jedes element den Fokus verliert:

$('#myform').validate({ onfocusout: function(element) { $(element).valid(); } };

Dieser zeigt die individuellen Fehler auf jedem Feld, jedoch möchte ich auch zeigen, die Fehler in der Validierung Zusammenfassung block. Jedoch, dass die Validierung Zusammenfassung zeigt nur, wenn das Formular abgeschickt wird, nicht auf den Fokus verloren.

Ich habe versucht Einhängen in showErrors jedoch, dass nur gibt mir das aktuelle Feld Fehler, nicht die aktuelle Liste der Fehler.

Vollständigkeit halber, hier ist das Formular-code:

@using (Ajax.BeginForm(...))
{

  <div class="field-panel">
    @Html.EditorFor(m => m.PatientID)
    ...

  </div>
  <input type="submit" class="carecon-button-next" value="Next" />
  @Html.ValidationSummary(null, new { @class = "validation-summary" })
}

Sie deuten an, dass Sie bereits eine "Validierung Zusammenfassung"... wie sind Sie zu generieren, der? Es ist nicht angezeigt, überall in Ihrem code.
Hinzugefügt der rest der Seite code..

InformationsquelleAutor lambinator | 2011-10-28

7

Ok, ich denke, ich habe dies aus.

Die Frage ist eigentlich durch die Verwendung der unaufdringlichen Validierung mit MVC 3, da es nicht die jQuery-Validierung Initialisierung für Sie Somit die einzige Möglichkeit zum konfigurieren der Validierung ist durch die Verwendung form.data("validator").settings. Jedoch, die versuchen, die errorLabelContainer über dieser Methode, d.h.:
```
$("#form").data("validator").settings.errorLabelContainer = "#messageBox";
```
... funktioniert nicht, weil die jQuery-Validierung verwendet nur diesen Wert intern in seiner init () - Funktion, zu konfigurieren, ein paar andere Einstellungen wie Containern etc. Ich habe versucht, zu emulieren, was es tut, oder sogar aufrufen $("#form").data("validator").init() wieder nach der Einstellung der errorLabelContainer, aber damit verursacht seltsame Verhalten und abgespritzt ein paar andere Einstellungen.

Also nahm ich einen anderen Ansatz. Erste, sofern ich einen Platz für MVC zu setzen, die individuelle Fehler-strings mit @Html.ValidationMessageFor(), und das hinzufügen von display:none zu halten es versteckt:
```
@using (Ajax.BeginForm(...))
{

  <div class="field-panel">
    @Html.EditorFor(m => m.PatientID)
    @Html.ValidationMessageFor(m => m.PatientID, null, new { style = "display:none"})
    ...

  </div>
  <input type="submit" class="carecon-button-next" value="Next" />
  <ul id="error-summary">
  </ul>
}
```
Dann, in der showErrors Rückruf, kopiere ich die entsprechenden Zeichenfolgen in der Validierung Zusammenfassung nach aufrufen defaultShowErrors():
```
    $("#form").data("validator").settings.onfocusout = function (element) { $(element).valid(); };
    $("#form").data("validator").settings.showErrors = function (errorMap, errorList) {
        this.defaultShowErrors();
        $("#error-summary").empty();
        $(".field-validation-error span", $("#form"))
            .clone()
            .appendTo("#error-summary")
            .wrap("<li>");

    };
```
Dies gab mir das Verhalten wollte ich zeigen/ausblenden der Validierung Fehler als Liste in der übersicht als der Benutzer ausgefüllt, die Felder auf dem Formular.

InformationsquelleAutor lambinator

Ich hatte ähnliche Probleme und schrieb, wie es scheint, ein einfacher Weg, das Verhalten, die Sie suchen:

function EnableEagerValidation(){
    var itemsNeedingValidation = $('*[data-val="true"]');
    itemsNeedingValidation.each(function () {
        $(this).blur(function(){$(this).closest("form").valid();});
    });
}

InformationsquelleAutor bonneyab

1

Dies ist aus der demo-Seite; die invalidHandler und der code zum erstellen einer Fehler-Zusammenfassung. Aber Sie wird ausgelöst, auf form Einreichen, das ist nicht das, was Sie angefordert.
```
invalidHandler: function(e, validator) {
    var errors = validator.numberOfInvalids();
        if (errors) {
            var message = errors == 1
                 ? 'You missed 1 field. It has been highlighted below'
                 : 'You missed ' + errors + ' fields.  They have been highlighted below';
                 $("div.error span").html(message);
                 $("div.error").show();
        } else {
            $("div.error").hide();
        }
},
```
Jedoch die errorLabelContainer: Methode erfordert keine form Vorlage. Gemäß der Dokumentation, "Alle Fehler, die Etiketten innerhalb einer ungeordneten Liste mit der ID "messageBox", wie angegeben durch den Selektor übergeben errorContainer option. Alle Fehler-Elemente verpackt in ein li-element, um eine Liste zu erstellen von Nachrichten."
```
errorLabelContainer: "#messageBox",
```
Hier ist eine grobe demo zeigt Validierung mit onfocusout. Es gibt keinen submit-button, um diesen Punkt zu beweisen. Die #messageBox sammelt alle Nachrichten, wie Sie gesammelt werden.

http://jsfiddle.net/sparky672/bAN2Q/
- Ich habe versucht errorLabelContainer zu meiner Zusammenfassung div, aber ohne Erfolg-es zeigt nur noch den Fehler in die container auf "Absenden".
- Die demo habe ich Hinzugefügt, um meine Antwort. Es muss nicht einmal ein submit-button.
- Danke für die demo!! Es half sehr dabei, herauszufinden, dass das problem war wirklich mit MVC-3..
InformationsquelleAutor Sparky

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.