Disable validation for certain fields

Question

In my Razor view (ASP.NET MVC 4), I have two radiobuttons for showing/hiding some fields. When the first radiobutton is selected, these fields are invisible; when the second radiobutton is selected, the fields become visible. This is done by a Javascript function which is bound to the radiobuttons onclick event.

function displayHiddenFields(value) {
  if (value == 'true')
    $('#myDiv').removeClass('hidden');
else
    $('#myDiv').addClass('hidden');
}

I'm using data annotations on the view model to perform validation. My problem is that the invisible fields are also validated. These fields only have to be validated when they are visible. I tried to manipulate the data-val attribute on the input elements but this doesn't work.

$('input1').attr('data-val', value);

How can I solve my problem? Is there a way to disable validation for the fields that are invisible by using client-side Javascript? Otherwise, I have to do a postback in order to render the fields conditionally.

You should remove these fields when radiobutton is one place and in the other you should use AJAX to add them again to form. — Mariusz
– Mariusz, Commented Nov 20, 2012 at 11:35
Possible duplicate of stackoverflow.com/questions/6913220/… — Suhas
– Suhas, Commented Nov 20, 2012 at 11:43

ngruson · Accepted Answer · 2012-11-21 13:22:55Z

8

I solved it by adding the following piece of JavaScript to the bottom of my page:

 <script type="text/javascript">
    $(function () {
        var settings = $.data($('form').get(0), 'validator').settings; 
        settings.ignore = ".hidden";
    });
</script>

This way, all the inputs that have the .hidden class applied to it will be ignored in the client-side validation.

answered Nov 21, 2012 at 13:22

ngruson

1,3481 gold badge17 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Owen · Accepted Answer · 2013-07-13 08:56:49Z

2

<button id="Submit" type="submit">Submit</button>
<script type="text/javascript">
    $("#Submit").on("click", function () {
        var validator = $("form").data('validator');
        validator.settings.ignore = "input[type=hidden]";
    });
</script>

answered Jul 13, 2013 at 8:56

Owen

4,4275 gold badges44 silver badges53 bronze badges

Comments

DeeDub · Accepted Answer · 2012-11-20 14:49:30Z

1

I would suggest using jQuery validation. You can conditionally validate your model:

if($("#field").is(":checked")){
//Add some validation here
}else{
//Default validation here
}
if($("form").valid()){
 //Do processing
}

The problem will be on the back-end. if you are using data annotations, I would assume you are validating the model in the controller as well; something like 'Model.isValid()' or the like? As long as both your cases (radio button1 click or button2 clicked) always matches what a "valid" model should be, you will be fine. Otherwise, you may have to turn off some of the data annotations. Just from my experience. jQuery Validation Docs

answered Nov 20, 2012 at 14:49

DeeDub

1,6621 gold badge12 silver badges18 bronze badges

Comments

Aycox · Accepted Answer · 2015-05-13 07:45:38Z

0

By default (at least in the later versions of the unobtrusive validation) the ignore field is set to ":hidden" (evaluated by jQuery) which is way better than just checking a class="hidden" or type="hidden".

answered May 13, 2015 at 7:45

Aycox

1362 silver badges7 bronze badges

Collectives™ on Stack Overflow

Disable validation for certain fields

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related