The attached example has the following views: Index.cshtml, _cbTest.cshtml (callback panel partial), _pcTest.cshtml (popup control partial) and _test.cshtml (content of the partial). The _test is the content of _cbTest, which is the content of _pcTest.
A button on Index calls the javascript method ShowTestWindow. Within this method are two lines of code:
cbTest.PerformCallback();
pcTest.Show();
When the popup is displayed, the Name and City fields are required. When you click the save button on the popup no client side validation is fired. If you comment out the cbTestPerformCallback in the ShowTestWindow and display the popup the client side validation works as expected.
Why is the client side validation not firing if the callback performs a callback?
We have closed this ticket because another page addresses its subject:
How to correctly enable Model, Unobtrusive or jQuery Client validation
Hello Tom:
Validation requires two actions which should be called on initial form rendering and on submit. For example:
[HttpGet]
public ActionResult Test() {…}
[HttpPost]
public ActionResult Test([ModelBinder(typeof(DefaultModelBinder))] TestModel model){…}
Attached is a project that illustrates this approach.
Thanks
Kate.
I don't believe my sample application was demonstrating my issue or I didn't explain it correctly. I have modified your sample application to better represent my issue. The example application now displays a list of cities in a gridview. If you double click on a row it will display the city details in a popup. Within the popup control is a callbackpanel control. On the gridview row double click, before the popup is displayed the callbackpanel's PerformCallback client method is called so the gridview row's data will be displayed in the popup.
The city's name and state are required fields. If you delete the name and/or state data from the fields and attempt to save, the client validation script is not called.
There is also an Add City button that is showing the popup without performing a callbackpanel callback. If you attempt to save with either field empty the client validation script is called.
So why does calling the callbackpanel's PerformCallback client method disable the client side validation?
Hello Tom:
Thank you for the sample and clear description of the task.
I have passed it to our R&D team for more detailed research. I will keep you informed of any progress.
Thanks
Kate.
Hello Tom:
This problem is caused by the fact that validation scripts are not initialized on callbacks.
You can solve it by calling the following script before the Save() method:
function PrepareValidationData(){ var form = $('#CityEditForm'); if (form.executed) return; form.removeData("validator"); $.validator.unobtrusive.parse(document); form.executed = true; }Attached is a project that illustrates this solution.
Thanks
Kate.
Thank you. That resolved my issue. Can you please mark this as Non-Private so it can be viewed by all users. Someone else might find this useful.
Hello Tom:
I am glad to hear that the issue is solved. I have marked this ticket as "Public".
Thanks
Kate.