How to manually trigger validation with jQuery validate

Question

I want to manually trigger validation including showing error messages with jQuery Validate   The scenario I am trying to accomplish is a form like this    lt form gt    lt input id i1 gt   lt button id b1 gt    lt input id i2 gt   lt button id b2 gt   lt  form gt    When clicking b1  only i1 should be validated  hen clicking b2  only i2 should be validated  However all fields must be posted  How can I do this  I thought about handling the click event for b1 b2 and manually validating a part of the form

User · Answer

Eva M from above  almost had the answer as posted above  Thanks Eva M     var validator        myform    validate    validator form      This is almost the answer  but it causes problems  in even the most up to date jquery validation plugin as of 13 DEC 2018  The problem is that if one directly copies that sample  and EVER calls   validate    more than once  the focus key processing of the validation can get broken  and the validation may not show errors properly   Here is how to use Eva M s answer  and ensure those focus key error-hiding issues do not occur   1  Save your validator to a variable global   var oValidator       myform   validate      2  DO NOT call     myform   validate   EVER again   If you call     myform   validate   more than once  it may cause focus key error-hiding issues   3  Use the variable global and call form   var bIsValid   oValidator form

User · Answer

As written in the documentation  the way to trigger  form validation programmatically is to invoke validator form    var validator        myform    validate    validator form

User · Answer

There is a good way if you use validate   with parameters on a form and want to validate one field of your form manually afterwards   var validationManager       myForm   validate myParameters       validationManager element   this      Documentation  Validator element

User · Answer

There is an undocumented method as of version 1 14    validator checkForm     This method silently validate for  return true false  It doesn t trigger error messages

User · Answer

In my similar case  I had my own validation logic and just wanted to use jQuery validation to show the message  This was what I did    x000D   x000D    1  Enable jQuery validation x000D  var validator       myForm   validate    x000D   x000D      myButton   click function    x000D      my own validation logic here x000D            x000D      2  when validation failed  show the error message manually x000D    validator showErrors   x000D       myField    my custom error message  x000D        x000D      x000D   x000D   x000D

User · Answer

i tried it worked tnx  Anastasiosyal i want to share it on this thread   I m not positive how the input fields did not trigger when I emptied the fields   But I managed to trigger each required field individually using       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              here s my view   using  Html BeginForm  SaveSettings    Settings   FormMethod Post  new  id    saveForm            lt div id  sevenRightBody  gt           lt div id  mapMenuitemPanel  class  setingsPanelStyle  style  display  block   gt               lt div class  defaultpanelTitleStyle  gt Map Settings lt  div gt              Customize the map view upon initial navigation to the map view page               lt p class  setting-p  gt  Html LabelFor x   gt  x NodeZoomLevel  lt  p gt               lt p class  setting-p  gt  Html EditorFor x   gt  x NodeZoomLevel   Html ValidationMessageFor x   gt  x NodeZoomLevel  lt  p gt               lt p class  setting-p  gt  Html LabelFor x   gt  x ZoomLevel  lt  p gt               lt p class  setting-p  gt  Html EditorFor x   gt  x ZoomLevel   Html ValidationMessageFor x   gt  x ZoomLevel  lt  p gt               lt p class  setting-p  gt  Html LabelFor x   gt  x CenterLatitude  lt  p gt               lt p class  setting-p  gt  Html EditorFor x   gt  x CenterLatitude   Html ValidationMessageFor x   gt  x CenterLatitude  lt  p gt               lt p class  setting-p  gt  Html LabelFor x   gt  x CenterLongitude  lt  p gt               lt p class  setting-p  gt  Html EditorFor x   gt  x CenterLongitude   Html ValidationMessageFor x   gt  x CenterLongitude  lt  p gt               lt p class  setting-p  gt  Html LabelFor x   gt  x NodeIconSize  lt  p gt               lt p class  setting-p  gt  Html SliderSelectFor x   gt  x NodeIconSize   Html ValidationMessageFor x   gt  x NodeIconSize  lt  p gt           lt  div gt    and my Entity     public class UserSetting   IEquatable lt UserSetting gt                 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

User · Answer

That library seems to allow validation for single elements  Just associate a click event to your button and try the following       myform   validate   element   i1      Examples here   https   jqueryvalidation org Validator element

User · Answer

My approach was as below  Now I just wanted my form to be validated when one specific checkbox was clicked changed       myForm input checkbox name yourChkBxName    click   function e         myForm   valid

User · Answer

Or one can simply use      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    Note that validate   needs to be called on the form before checking it using this method  Documentation link  https   jqueryvalidation org valid

[javascript] How to manually trigger validation with jQuery validate?

Examples related to javascript

Examples related to jquery

Examples related to html

Examples related to jquery-validate