load partial view in to a modal popup

Question

I am working with MVC3 c# 4.0.

I have created a partial view.

I have a button on my page, when I click this button I want to be able to load the partial view

Answer 1

You could use jQuery UI dialog.

So you start by writing a controller:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult Modal()
    {
        return PartialView();
    }
}

then a Modal.cshtml partial that will contain the partial markup that you want to display in the modal:

This is the partial view

and an Index.cshtml view containing the button which will show the partial into a modal when clicked:

@Html.ActionLink("show modal", "modal", null, new { @class = "modal" })

Obviously in this example I have put the directly scripts into the Index view but in a real application those scripts will go into separate javascript file.