Загрузка частичного просмотра в модальное всплывающее окно

Question

Я работаю с MVC3 C# 4.0.

Я создал частичный вид.

У меня есть кнопка на моей странице, когда я нажимаю эту кнопку, я хочу иметь возможность загружать частичный вид в модальное всплывающее окно. Я предполагаю, что лучший способ сделать это через javascript - я использую jQuery уже в приложении.

Любые указания относительно того, как я мог это сделать?

Answer 1

Вы можете использовать jQuery UI dialog.

Так вы начинаете писать контроллер:

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

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

то Modal.cshtml частичный, который будет содержать частичную разметку, которую вы хотите отобразить в модальный:

<div>This is the partial view</div> 

и Index.cshtml вид, содержащий кнопка, которая будет показывать частичную в модальную форму при нажатии:

<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.js")" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(function() { 
     $('.modal').click(function() { 
      $('<div/>').appendTo('body').dialog({ 
       close: function (event, ui) { 
        dialog.remove(); 
       }, 
       modal: true 
      }).load(this.href, {}); 

      return false;    
     }); 
    }); 
</script> 

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

Очевидно, что в этом примере я поместил непосредственно скрипты в представление Index, но в реальном приложении эти скрипты войдут в отдельный файл javascript.