Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

MVC : How to enable client side validation on hidden fields

@Scripts

 <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")"></script>   <script src="@Url.Content("~/Scripts/jquery.validate.js")"></script>   <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")"></script> 

@View

@using (Html.BeginForm("TestModelState", "RandD", FormMethod.Post, new {id="form123" })) {      @Html.TextBoxFor(x => x.htmlText, new { style="display:none"})<br />     @Html.ValidationMessageFor(x => x.htmlText)     <div>       @Html.TextBoxFor(x => x.Uprop1)<br />       @Html.ValidationMessageFor(x => x.Uprop1)     </div>     <input type="submit" value-="Submit" onclick="abc()" /> } 

WHAT I have tried

  1. Replaced ignore: ":hidden", with ignore: "", inside validate.js
  2. var validateMeta = $('#form123').validate(); validateMeta.settings.ignore = "";

  3. $.validator.setDefaults({ignore: ""});

  4. $.validator.setDefaults({ ignore: [] });

like image 737
RollerCosta Avatar asked Jul 04 '14 10:07

RollerCosta


People also ask

How do I enable client side validation?

We can enable and disable the client-side validation by setting the values of ClientValidationEnabled & UnobtrusiveJavaScriptEnabled keys true or false. This setting will be applied to application level. For client-side validation, the values of above both the keys must be true.

How client side validation is implemented in MVC?

It turns out that to enable client side validation without using the HtmlHelpers and a model you just have to add an input with data-val="true" and then data-val- followed by validation method that you want to apply (e.g. data-val-required ), the value of which will be the error message presented to the user (e.g. data ...

How do I turn off unobtrusive validation?

You can disable the unobtrusive validation from within the razor code via this Html Helper property: HtmlHelper. ClientValidationEnabled = false; That way you can have unobtrusive validation on and off for different forms according to this setting in their particular view/partial view.


2 Answers

I ran into this same problem. A hidden field on a page was storing a user ID, which was selected from an autocomplete text box. This ID had validation to ensure that a non-zero id was posted back. We wanted to include this validation in the client side.

By default jQuery validate ignores hidden fields, elements with zero width and height, those with css display:none and any elements with an invisible parent (using same criteria).

The ignore setting can however be overridden by adding the following script (I just added it to my custom validator script before calling $.validator.addMethod()):

// By default validator ignores hidden fields. // change the setting here to ignore nothing $.validator.setDefaults({ ignore: null }); 

NOTE: This code won't work if it's run inside the document ready or jQuery $(function () {}) method.

like image 87
Robin Hames Avatar answered Sep 25 '22 17:09

Robin Hames


Just after you insert the script for validation set the ignore to "":

@section Scripts {     @Scripts.Render("~/bundles/jqueryval")     <script type="text/javascript">     $.validator.setDefaults({         ignore: ""     });     </script> } 
like image 40
IonutC Avatar answered Sep 21 '22 17:09

IonutC