How to keep client side MVC 4 validation disabled when a form is rendered again after post back?

Question

I have an Edit form where the user can disable MVC 4 client side validation for certain fields. I am disabling the client side validation with jQuery:

$("#CustomerOrderNumber").prop("disabled", true);

This work fine when the form is first rendered.

The problem arises when I post back the form and then redisplay the form from a controller like this:

[HttpPost]
public ActionResult RegisterImei(ImeiCustOrderNumberModel model)
{
    return View(model);
}

Because when the form is rendered again, the disabled validation in no longer disabled, and the unwanted client side validation for the field is active again.

It seems that this is determined by the original source markup:

<input class="text-box single-line" data-val="true" data-val-required="The Customer Order Number field is required." id="CustomerOrderNumber" name="CustomerOrderNumber" type="text" value="SF1861-" />

Any ideas on how to keep client side validation disabled when a form is rendered again after post back?

I have made a little sample app illustrating my problem. If the user disable Field B the user can post back the model without Field B being validated. But when the page renders again, it has forgotten that Field B was disabled. And the unwanted client side validation message for Field B renders. I want my page to remember that Field B was disabled and stop rendering client side validation messages. Mvc4SampleApp.zip: http://sdrv.ms/14FUKa6

Answer 1

I found the solution to the problem in this thread:

One of the interesting parts of the answer in the thread is the question about ModelState, I quote from the answer:

"The state of ModelState.IsValidate will be false if the value of either FieldA or FieldB is null although it is pass in client validate. So we should reset the ModelState of that field that we don't validate."

http://forums.asp.net/p/1934978/5507137.aspx?Re+How+to+keep+client+side+MVC+4+validation+disabled+when+a+form+is+rendered+again+after+post+back+

Answer 2

After a postback the element will lose its disabled property, you will have to re-apply prop("disabled", true) to the element after the postback

Or could you use <% Html.EnableClientValidation(false); %> before the field?