c# - 部分ビューをモーダルポップアップにロードします

Question

私はMVC3c＃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 ファイルに配置されます。