9

I have used the method described here to localize my data annotation messages and basically it is working fine in normal form posts. I can see the localized validation message on client side as well.

However, problem occurs when I have a partial view that has the input fields to be validated and is loaded using an ajax call. For some reason, I get the default validation message ("This field is required") instead of my localized message that is set in data-val-required attribute of the element.

I have verified the following:
1. I have included both "jquery.validate.min.js" and "jquery.validate.unobtrusive.min.js".
2. I checked the ajax response and it does contain data-val-required attribute with localized message.

I have already tried the following solutions:
1. I tried parsing the ajax response (that didn't work) as $.validator.unobtrusive.parse('form')
2. Parsing dynamic content for validation as described here. Still no solution.

I have a pressing deadline and this is troubling me.

Improve this question
6
  • Are you attempting to validate immediately after adding the content from the partial, or is the dynamic content submitted normally with the rest of the form? Commented Jun 15, 2012 at 10:09
  • The dynamic content is submitted normally with the rest of the form. Commented Jun 15, 2012 at 17:57
  • Finally had a breakthrough. There were two forms in my page, one in the index page and one in the partial page. The buttons on whose click the form would submit were on index page. I moved the buttons in the partial page so that it is inside the form element of the partial page, and lo! it worked fine. Although the problem is solved, I do not know what caused the problem and how moving the buttons in the innermost form solved it? My problem is solved but if someone can help me understand the cause, I could mark it as an answer and close this question. Commented Jun 18, 2012 at 18:17
  • Does the resultant markup (from loading the partial view) create a form within a form? If so, that would be the problem. A form cannot have another form within it. Commented Jun 18, 2012 at 20:38
  • Yes, the markup contains a form within a form. The elements with the validation attributes were in the inner form while the buttons were in the outer form. I assume that it was submitting the outer form. Why would the inner form create a problem? Commented Jun 19, 2012 at 5:54

2 Answers 2

Reset to default
3

I think you already tried this: stackoverflow.com/questions/4406291/jquery-validate-unobtrusive-not-working-with-dynamic-injected-elements - the answer by Steve Lamb helped me the most.

Basically, you need to re-initialize the validator whenever you change the page content, as the validation code builds a list to track the controls it needs to validate only once, on page load...

I also seemed to have to add some extra code to go through and make sure the inputs were named correctly. Give me a moment and I'll dig the code up. - hmm, sorry, that code was part of a client app, and I can't post it. Not too sure it would have made a difference anyway...

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

1 Comment

Thanks Tieson, I had tired that. However, I accidentally solved it. Read my comment below the question. Still confused what the problem was.
0

Just in case someone drop in this question, as the documentation states, it is required that your field has a name attribute:

Mandated: A 'name' attribute is required for all input elements needing validation, and the plugin will not work without this. A 'name' attribute must also be unique to the form, as this is how the plugin keeps track of all input elements. However, each group of radio or checkbox elements will share the same 'name' since the value of this grouping represents a single piece of the form data.

Source

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.