jQuery Validierung Plugin: disable Validierung für bestimmte Tasten einreichen

Question

Ich habe ein Formular mit mehreren Feldern, die ich (einige mit Methoden hinzugefügt, um benutzerdefinierte Validierung) mit Jörn Zaeffere ausgezeichneter jQuery Validierung Plugin bin zu validieren. Wie umgehen Sie die Validierung mit angegeben einreichen Kontrollen (in anderen Worten, Feuer Validierung mit einigen Eingaben einreichen, aber nicht mit anderem Brand Validierung)? Dies wäre ähnlich wie ValidationGroups mit Standard ASP.NET Validierungssteuer.

Meine Situation:

Es ist mit ASP.NET WebForms, aber man kann ignorieren, dass, wenn Sie es wünschen. Aber ich bin mit der Validierung mehr als „Empfehlung“: mit anderen Worten, wenn das Formular abgeschickt wird, Validierung Feuer, sondern eine „erforderlich“ Meldung angezeigt wird, eine „Empfehlung“ zeigt, dass etwas sagt, entlang der Linie „Sie die folgenden Felder verpasst .... tun Sie sowieso fortfahren möchten?“ An diesem Punkt in den Fehlern Container gibt es eine andere Taste nun sichtbar trägt vor, gedrückt werden kann, die die Validierung ignorieren würde und senden Sie sowieso. Wie die Formen .validate () für diese Schaltfläche Kontrolle umgehen und noch schreiben?

Der Kauf und Verkauf eines Hauses Probe unter http://jquery.bassistance.de/validate / demo / multipart / dies ermöglicht es, um die oben aufgeführten Links zu treffen, aber es tut dies durch individuelle Methoden zu schaffen und es den Validator hinzugefügt wird. Ich würde es vorziehen, nicht benutzerdefinierte Methoden erstellen haben Funktionen, die bereits bei der Validierung Plugin duplizieren.

Das Folgende ist eine verkürzte Version des unmittelbar anwendbar Skript, das ich jetzt habe:

var container = $("#<%= Form.ClientID %> div.validationSuggestion");

$('#<%= Form.ClientID %>').validate({          
    errorContainer: container,
    errorLabelContainer: $("ul",container),
    rules: {
        <%= YesNo.UniqueID %>: { required: true },
        <%= ShortText.UniqueID %>: { required: true } // etc.

    },
    messages: {
        <%= YesNo.UniqueID %>: 'A message.',
        <%= ShortText.UniqueID %>: 'Another message.' // etc.
    },
    highlight: function(element, errorClass) {
        $(element).addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass("valid");
    },
    unhighlight: function(element, errorClass) {
        $(element).removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass("valid");
    },
    wrapper: 'li'
}); 

Answer 1

Sie können eine CSS-Klasse von cancel auf einen Submit-Button fügen Sie die Validierung zu unterdrücken

z

<input class="cancel" type="submit" value="Save" />

Sehen Sie die jQuery Validator Dokumentation dieser Funktion hier: Validierung Skipping auf einreichen

---

Bearbeiten :

Die obige Technik wurde mit dem formnovalidate Attribute ist veraltet und ersetzt werden.

<input formnovalidate="formnovalidate" type="submit" value="Save" />

Answer 2

Andere (ohne Papiere) Art und Weise, es zu tun, zu nennen ist:

$("form").validate().cancelSubmit = true;

auf dem Click-Ereignisse der Schaltfläche (zum Beispiel).

Answer 3

Noch eine andere (dynamisch) Art und Weise:

$("form").validate().settings.ignore = "*";

Und wieder aktivieren wir den Standardwert nur zurück:

$("form").validate().settings.ignore = ":hidden";

Quelle: https://github.com/jzaefferer/jquery- Validierung / Themen / 725 # issuecomment-17.601.443

Answer 4

Fügen Sie formnovalidate Attribut Eingabe

    <input type="submit" name="go" value="Submit"> 
    <input type="submit" formnovalidate name="cancel" value="Cancel"> 

Hinzufügen class = "cancel" veraltet ist jetzt

docs Siehe zur Validierung Skipping auf einreichen auf diesem Link

Answer 5

Sie können die onsubmit: false Option (siehe Dokumentation ), wenn die Überprüfung der Verdrahtung auf, die auf der Einreichung des Formulars nicht validiert werden. Und dann in Ihren asp: Button fügen Sie eine OnClientClick = $ ( '# aspnetForm') gültig ();. explizit zu überprüfen, ob Form gültig ist.

Sie könnten nennen dies das Opt-in-Modell anstelle des Opt-out oben beschrieben.

Beachten Sie, ich bin auch mit jQuery Validierung mit ASP.NET WebForms. Es gibt einige Probleme zu navigieren, aber wenn man durch sie bekommen, die User Experience ist sehr gut.

Answer 6

(Erweiterung der @lepe der und @redsquare Antwort für ASP.NET MVC + jquery.validate.unobtrusive.js)

---

Die Jquery Validierung Plugin (nicht der Microsoft unaufdringlich ein) können Sie eine .cancel Klasse setzen auf Ihrem einreichen vollständig in der Bypass-Validierungstaste (wie in akzeptierter Antwort gezeigt).

 To skip validation while still using a submit-button, add a class="cancel" to that input.

  <input type="submit" name="submit" value="Submit"/>
  <input type="submit" class="cancel" name="cancel" value="Cancel"/>

(nicht zu verwechseln mit type='reset' das ist etwas ganz anders )

Leider ist die jquery.validation.unobtrusive.js Validierung Handling (ASP.NET MVC) Code irgendwie vermasselt die jquery.validate Plugin Standardverhalten .

Das ist, was ich kam mit Ihnen erlauben .cancel auf die Schaltfläche setzen einreichen, wie oben gezeigt. Wenn Microsoft jemals fixiert ', das dann können Sie einfach diesen Code remvoe.

    // restore behavior of .cancel from jquery validate to allow submit button 
    // to automatically bypass all jquery validation
    $(document).on('click', 'input[type=image].cancel,input[type=submit].cancel', function (evt)
    {
        // find parent form, cancel validation and submit it
        // cancelSubmit just prevents jQuery validation from kicking in
        $(this).closest('form').data("validator").cancelSubmit = true;
        $(this).closest('form').submit();
        return false;
    });

Hinweis: Wenn zuerst versuchen, es scheint, dass dies nicht funktioniert - stellen Sie sicher, dass Sie nicht auf den Server und Roundtripping einen Server generierte Seite mit Fehlern zu sehen. Sie werden die Validierung auf der Serverseite durch andere Mittel umgehen müssen - dies ermöglicht nur die Form Client-Seite ohne Fehler vorgelegt werden (die Alternative wäre .ignore Attribute, um alles in Ihrem Formular des Hinzufügen)

.

(Hinweis: Sie können button dem Selektor hinzufügen müssen, wenn Sie Tasten verwenden einreichen)

Answer 7

Diese Frage ist alt, aber ich einen anderen Weg gefunden, um es zu benutzen $('#formId')[0].submit() ist, die anstelle des jQuery-Objekt das DOM-Element bekommt, damit keine Validierungshaken umgangen wird. Diese Schaltfläche sendet das übergeordnete Formular, die die Eingabe enthält.

<input type='button' value='SubmitWithoutValidation' onclick='$(this).closest('form')[0].submit()'/>

Also, stellen Sie sicher, dass Sie keine haben input den Namen „Eintragen“, oder er überschreibt die Funktion mit dem Namen submit.

Answer 8

Ich fand, dass die flexibelste Möglichkeit Gebrauch jQuerys zu tun ist:

event.preventDefault():

z. wenn statt der Vorlage ich umleiten möchten, kann ich tun:

$("#redirectButton").click(function( event ) {
    event.preventDefault();
    window.location.href='http://www.skip-submit.com';
});

oder ich kann die Daten an einen anderen Endpunkt senden (zum Beispiel, wenn ich die Aktion ändern mag):

$("#saveButton").click(function( event ) {
    event.preventDefault();
    var postData = $('#myForm').serialize();
    var jqxhr = $.post('http://www.another-end-point.com', postData ,function() {
    }).done(function() {
        alert("Data sent!");
    }).fail(function(jqXHR, textStatus, errorThrown) {
        alert("Ooops, we have an error");
    })

Wenn Sie das tun 'Event.preventDefault ();' Sie umgehen Validierung.

Answer 9

I mit zwei Tasten für Formular-Vorlage haben, Knopf drücken Speichern und beenden umgeht die Validierung:

$('.save_exist').on('click', function (event) {
            $('#MyformID').removeData('validator');
            $('.form-control').removeClass('error');
            $('.form-control').removeClass('required');                
            $("#loanApplication").validate().cancelSubmit = true;
            $('#loanApplication').submit();
            event.preventDefault();
});

Answer 10

$("form").validate().settings.ignore = "*";

oder

$("form").validate().cancelSubmit = true;

Aber ohne Erfolg in einem benutzerdefinierten erforderlich Validator. Für einen Anruf dynamisch einreichen, ich habe eine gefälschte erstellt Knopf mit diesem Code versteckt einreichen:

var btn = form.children('input.cancel.fakeSubmitFormButton');
if (btn.length === 0) {
    btn = $('<input name="FakeCancelSubmitButton" class="cancel fakeSubmitFormButton hide" type="submit" formnovalidate value="FakeCancelSubmitButton" />');
    form.append(btn);
}
btn.click();

Jetzt die Validierung überspringen richtig:)

Answer 11

Hier ist die einfachste Version, hoffen, es hilft jemanden,

$('#cancel-button').click(function() {
    var $form = $(this).closest('form');
    $form.find('*[data-validation]').attr('data-validation', null);
    $form.get(0).submit();
});