jQuery validation fails when using KnockoutJS and Jquery dialog

Question

I have a form which is rendered using html.RenderAction in MVC3.

Outside of this I have a jquery template used with knockout. The model is rendered correctly into t

Answer 1

I have looked into the code of jQuery validate and I think it doesn't work for dynamically added forms (which what Knockout does).

Take a look at this > Jquery Validation Plugin, dynamic form validation

You need to call the validate() method in a an event handler registered using the jQuery live() method. The live method links to all the dynamically added elements as well.

Let me know if it works.

Answer 2

Try calling $.validator.unobtrusive.parse(yourFormElement) to get your data- attributes related to validation parsed.

You could trigger it like:

<div id="dlgAdd" data-bind="template: { name: 'editTemplate', data: selected, afterRender: hookUpValidation  }">
</div>

then, hookUpValidation would look like:

hookUpValidation: function(nodes) {
    $.validator.unobtrusive.parse(nodes[0]);
}