it-swarm.com.de

Wie man die Validierung manuell mit jQuery validate auslöst?

Ich möchte die Validierung manuell auslösen, einschließlich der Anzeige von Fehlermeldungen mit jQuery Validate .

Das Szenario, das ich zu erreichen versuche, ist eine Form wie folgt:

<form>
 <input id=i1> <button id=b1>
 <input id=i2> <button id=b2>
</form>

Wenn Sie auf b1 klicken, sollte nur i1 überprüft werden. Wenn Sie auf b2 klicken, sollte nur i2 überprüft werden. Es müssen jedoch alle Felder ausgefüllt werden. Wie kann ich das machen? Ich habe darüber nachgedacht, das Klickereignis für b1/b2 zu behandeln und einen Teil des Formulars manuell zu überprüfen.

125
usr

Diese Bibliothek scheint die Validierung einzelner Elemente zu ermöglichen. Verknüpfen Sie einfach ein Klickereignis mit Ihrer Schaltfläche und versuchen Sie Folgendes:

$("#myform").validate().element("#i1");

Beispiele hier:

http://docs.jquery.com/Plugins/Validation/Validator/element#element

158
Roberto Aloi

Oder man kann einfach verwenden: $('#myElem').valid()

if ($('#myElem').valid()){
   // will also trigger unobtrusive validation only for this element if in place 
   // add your extra logic here to execute only when element is valid
}
96
Anastasiosyal

Mein Ansatz war wie folgt. Jetzt wollte ich nur, dass mein Formular überprüft wird, wenn ein bestimmtes Kontrollkästchen angeklickt/geändert wurde:

$('#myForm input:checkbox[name=yourChkBxName]').click(
 function(e){
  $("#myForm").valid();
}
)
25
Yoosaf Abdulla

Wie in der Dokumentation geschrieben, können Sie die Validierung des Formulars programmgesteuert auslösen, indem Sie validator.form ()

var validator = $( "#myform" ).validate();
validator.form();
6
Eva M

Es gibt eine undokumentierte Methode ab Version 1.14

validator.checkForm()

Diese Methode validiert automatisch die Rückgabe true/false. Es werden keine Fehlermeldungen ausgelöst.

4
user5936891

Eva M von oben hatte fast die Antwort wie oben geschrieben (Danke Eva M!):

var validator = $( "#myform" ).validate();
validator.form();

Dies ist fast die Antwort, aber es verursacht Probleme, selbst mit dem aktuellsten Plugin für die Jquery-Validierung ab dem 13. Dezember 2018. Das Problem ist, dass das Sample direkt kopiert wird und EVER ".validate ()" mehrmals aufruft Die Fokus-/Tastenverarbeitung der Validierung kann unterbrochen werden und die Validierung zeigt möglicherweise keine Fehler an.

So verwenden Sie die Antwort von Eva M. und stellen Sie sicher, dass diese Fokus-/Schlüssel-/Fehlerausblendungsprobleme nicht auftreten:

1) Speichern Sie Ihren Prüfer in einer Variablen/Global.

var oValidator = $("#myform").validate();

2) Rufen Sie NICHT $ ("# myform"). Validate () EVER erneut auf.

Wenn Sie $ ("# myform"). Validate () mehr als einmal aufrufen, kann dies zu Problemen mit dem Fokus/Schlüssel/Fehler führen.

3) Verwenden Sie die Variable/global und das Aufrufformular.

var bIsValid = oValidator.form();
1
J-S-B

Es gibt eine gute Möglichkeit, wenn Sie validate() mit Parametern in einem Formular verwenden und anschließend ein Feld Ihres Formulars manuell überprüfen möchten:

var validationManager = $('.myForm').validate(myParameters);
...
validationManager.element($(this));

Dokumentation: Validator.element ()

0
Tobi G.

ich versuchte es funktionierte tnx @ Anastasiosyal Ich möchte es in diesem Thread teilen.

Ich bin nicht sicher, wie die Eingabefelder nicht ausgelöst wurden, als ich die Felder geleert habe. Ich habe es jedoch geschafft, jedes benötigte Feld einzeln auszulösen:

$(".setting-p input").bind("change", function () {
        //Seven.NetOps.validateSettings(Seven.NetOps.saveSettings);
        /*$.validator.unobtrusive.parse($('#saveForm'));*/
        $('#NodeZoomLevel').valid();
        $('#ZoomLevel').valid();
        $('#CenterLatitude').valid();
        $('#CenterLongitude').valid();
        $('#NodeIconSize').valid();
        $('#SaveDashboard').valid();
        $('#AutoRefresh').valid();
    });

hier ist meine Ansicht

@using (Html.BeginForm("SaveSettings", "Settings", FormMethod.Post, new {id = "saveForm"}))
{
    <div id="sevenRightBody">
        <div id="mapMenuitemPanel" class="setingsPanelStyle" style="display: block;">
            <div class="defaultpanelTitleStyle">Map Settings</div>
            Customize the map view upon initial navigation to the map view page.
            <p class="setting-p">@Html.LabelFor(x => x.NodeZoomLevel)</p>
            <p class="setting-p">@Html.EditorFor(x => x.NodeZoomLevel) @Html.ValidationMessageFor(x => x.NodeZoomLevel)</p>
            <p class="setting-p">@Html.LabelFor(x => x.ZoomLevel)</p>
            <p class="setting-p">@Html.EditorFor(x => x.ZoomLevel) @Html.ValidationMessageFor(x => x.ZoomLevel)</p>
            <p class="setting-p">@Html.LabelFor(x => x.CenterLatitude)</p>
            <p class="setting-p">@Html.EditorFor(x => x.CenterLatitude) @Html.ValidationMessageFor(x => x.CenterLatitude)</p>
            <p class="setting-p">@Html.LabelFor(x => x.CenterLongitude)</p>
            <p class="setting-p">@Html.EditorFor(x => x.CenterLongitude) @Html.ValidationMessageFor(x => x.CenterLongitude)</p>
            <p class="setting-p">@Html.LabelFor(x => x.NodeIconSize)</p>
            <p class="setting-p">@Html.SliderSelectFor(x => x.NodeIconSize) @Html.ValidationMessageFor(x => x.NodeIconSize)</p>
        </div>

und meine Entität

   public class UserSetting : IEquatable<UserSetting>
    {
        [Required(ErrorMessage = "Missing Node Zoom Level.")]
        [Range(200, 10000000, ErrorMessage = "Node Zoom Level must be between {1} and {2}.")]
        [DefaultValue(100000)]
        [Display(Name = "Node Zoom Level")]
        public double NodeZoomLevel { get; set; }

        [Required(ErrorMessage = "Missing Zoom Level.")]
        [Range(200, 10000000, ErrorMessage = "Zoom Level must be between {1} and {2}.")]
        [DefaultValue(1000000)]
        [Display(Name = "Zoom Level")]
        public double ZoomLevel { get; set; }

        [Range(-90, 90, ErrorMessage = "Latitude degrees must be between {1} and {2}.")]
        [Required(ErrorMessage = "Missing Latitude.")]
        [DefaultValue(-200)]
        [Display(Name = "Latitude")]
        public double CenterLatitude { get; set; }

        [Range(-180, 180, ErrorMessage = "Longitude degrees must be between {1} and {2}.")]
        [Required(ErrorMessage = "Missing Longitude.")]
        [DefaultValue(-200)]
        [Display(Name = "Longitude")]
        public double CenterLongitude { get; set; }

        [Display(Name = "Save Dashboard")]
        public bool SaveDashboard { get; set; }
.....
}
0
bherto39

In meinem ähnlichen Fall hatte ich meine eigene Validierungslogik und wollte nur die jQuery-Validierung verwenden, um die Nachricht anzuzeigen. Das habe ich getan.

//1) Enable jQuery validation
var validator = $('#myForm').validate();

$('#myButton').click(function(){
  //my own validation logic here
  //.....
  //2) when validation failed, show the error message manually
  validator.showErrors({
    'myField': 'my custom error message'
  });
});

0
user538220