jquery client side validation not working in MVC3 partial view

by

Any ideas?

Yes, the very first thing you should do is to get rid of all those <script> tags from your partial view. Partial views should not contain any scripts. Partial views should contain only markup. I have repeated this many times and still see people putting scripts in-there. Scripts should be registered either in your Layout or the main View in which you have rendered the partial, probably by overriding some scripts section registered in your Layout so that all scripts get inserted into the end of your HTML document, just before the closing </body> tag. That’s where they belong.

OK, now to the actual problem: unobtrusive validation doesn’t work out-of-the-box with dynamically added elements to the DOM – such as for example sending an AJAX request to the server which returns a partial view and this partial view is then injected into the DOM.

In order to make it work you need to register those newly added elements with the unobtrusive validation framework. To do this you need to call the $.validator.unobtrusive.parse on the newly added elements:

$("form").removeData("validator");
$("form").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse("form");

You should put this code inside the AJAX success handler that is injecting the partial into your DOM. Once you have injected the new elements simply call this function.

And if you are not writing your AJAX requests manually with jQuery ($.ajax, $.post, …) but are relying on some Ajax.BeginForm and Ajax.ActionLink helpers do the job for you, you will need to subscribe to the OnSuccess callback in the AjaxOptions and put this code in there.

More Related Contents:

  1. ASP.net MVC 3 jQuery Validation; Disable Unobtrusive OnKeyUp?
  2. How to add a ‘submitHandler’ function when using jQuery Unobtrusive Validation?
  3. Manually set unobtrusive validation error on a textbox
  4. validation for at least one checkbox
  5. How to display messages from jQuery Validate plugin inside of Tooltipster tooltips?
  6. jQuery validate: How to add a rule for regular expression validation?
  7. jQuery Validate – require at least one field in a group to be filled
  8. jQuery Validation Plugin – adding rules that apply to multiple fields
  9. jQuery Validate Required Select
  10. jQuery validator and a custom rule that uses AJAX
  11. MVC DateTime validation – UK Date format
  12. How to validate array of inputs using validate plugin jquery
  13. jQuery validate dynamic input array
  14. Unobtrusive validation in Chrome won’t validate with dd/mm/yyyy
  15. Jquery Datepicker Chrome
  16. jQuery Validate plugin – password check – minimum requirements – Regex
  17. How can I use jQuery validation with the “chosen” plugin?
  18. Unobtrusive Ajax stopped working after update jQuery to 1.9.0
  19. jQuery Validate Ignore elements with style
  20. Jquery Validation for Dynamically Created Fields
  21. onkeyup and onfocusout is not working in jQuery Validate
  22. select2 and jquery validation not working properly
  23. Validate dynamic field jquery
  24. Ignore all hidden div but not one in jQuery validation
  25. jquery validation: prevent form submit
  26. Validating array inputs using jquery validation plugin
  27. MVC 4 client side validation not working
  28. jQuery validator and datepicker click not validating
  29. jquery validation not waiting for remote validation to return true, considers form valid
  30. How to include JavaScript files by h:outputScript? [duplicate]

Leave a Comment