Wie manuell Validierung mit jQuery Validierung auslösen?

Question

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

Das Szenario I ist eine Form wie dies zu erreichen versuchen:

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

Wenn b1 klicken, nur i1 validiert werden soll. Klicken Sie auf b2, nur i2 sollte validiert werden. Allerdings müssen alle Felder gebucht werden. Wie kann ich das machen? Ich dachte darüber nach, das Click-Ereignis für b1/b2 zu behandeln und einen Teil des Formulars manuell zu validieren.

Answer 1

Diese Bibliothek scheint die Validierung für einzelne Elemente zu ermöglichen. Nur in Verbindung zu Ihrer Schaltfläche ein Click-Ereignis und versuchen Sie Folgendes:

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

Beispiele hier:

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

Answer 2

Mein Ansatz wie unten war. Jetzt wollte ich nur meine Form validiert werden, wenn eine bestimmte Checkbox geklickt wurde/geändert:

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

Answer 3

Oder man kann einfach nutzen: $('#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 
} 

Answer 4

Ich habe versucht, es funktionierte tnx @Anastasiosyal ich will teilen es auf diesem Thread.

Ich bin nicht positiv, wie die Eingabefelder nicht ausgelöst haben, wenn ich die Felder geleert habe. Aber ich schaffte es jedes erforderliche Feld einzeln triggerbar:

$(".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 mein Entity

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; } 
..... 
} 

Answer 5

Es ist eine nicht dokumentierte Methode ab Version 1.14

validator.checkForm() 

Diese Methode überprüft unbemerkt die Rückgabe wahr/falsch. Es löst keine Fehlermeldungen aus.

Answer 6

Es ist ein guter Weg, wenn Sie validate() mit Parametern auf einem Formular verwenden und wollen anschließend manuell ein Feld des Formulars überprüfen:

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

Dokumentation: Validator.element()

Answer 7

In meinem ähnlichen Fall, ich hatte 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' 
 
    }); 
 
});