Using jQuery UI Modal Form from MVC List Page

Lets say I have:
$(document).ready(function() {



$(‘.myPop’).click(function() {




Which allows me to pop-up on the click of ‘.myPop’ which is just a temp input button in my list which is working: My question is – what is the best way to use this pop-up to go to the Edit method of my controller, populate controls and then be able to save back to the model and refresh the list page? There’s obviously a bunch of ways to do that, but here’s how I would solve it. Perform an Ajax call before loading the dialog to populate the dialog’s contents, show the dialog, than on save close the dialog and refresh the grid. Those are the basics, there’s some helper code below. I find it a good practice to return a json result from the save action to determine if the saved was successful, and if not an error message that indicates why it failed to display to the user.

$(function() {

$(‘.myPop’).click(function() {



function(data){ $(“#dialog”).html(data); }); $(“#dialog”).dialog(‘open’);



function Save(){


“/editController/Edit”, $(“#exampleForm”).serialize(),

function(data){ $(“#dialog”).dialog(‘close’); } ////update grid with Ajax call



Please like this article on social site if this worked for you… Coding is fun !!! Isn't it...