Loading and editing data in the jQuery UI dialog

Question

I have an asp.net mvc application and I use Webgrid to list clients.

I want to edit client data in the jQuery dialog, so I think doing an action on my controller by returning a PartialView is the best way. The problem is that this PartialView has javascript code to validate this input (I use jQuery validation to validate on the client side). My questions:

• All script to check my form in the dialog box and send it to the server using jquery and ajax, should be on the page or is there a way to place it in PartialView?

• What is the best way to load partialView in my dialog (method $ .post, $ .get, .load, etc.)? Can I use mail safely?

• Is there any sample code to post or some link to show? I would like to see some code examples :)

thank

Answer 1

This SO answer should help you with loading the JQuery UI dialog using PartialView, and my experience is that PartialView can contain JavaScript, but only if it is served as if it is a View, i.e. JavaScript inside the PartialView, called from another PartialView, my does not work

Answer 2

There are several ways to load a partial view in the jquery dialog. It uses the safest approach, namely loading a partial view when the page loads. Something like that:

<div id="mydialog"> @Html.Partial("MyAction", "MyController") </div> 

and then using jquery I convert this div block to a jquery dialog.

  <script type="text/javascript"> $(document).ready(function () { $("#mydialog").dialog(); }); //this function can be used in onclick handler from anywhere to show the dialog. function OpenDialog() { $("#mydialog").dialog("open"); } </script> 

Why I find it safe, because all kinds of validation work very well, and code reuse is applied. However, you can dynamically load a partial view into a dialog, as suggested by jimmym. You have to be careful with the two pitfalls here.

• Jquery unobtrusive should parse the newly loaded form. You can do something like this.

  $. Validator.unobtrusive.parse ($ ('# MyForm'))

• Make sure that you do not upload nested forms.