asp.net-mvc-3 - 在 jquery.dialog 中加载部分 View

Question

我是 mvc 的新手，正在尝试创建一个虚拟应用程序来学习 mvc 3。我已经完成了音乐商店示例，现在我正在尝试将其稍微扩展到更真实的应用程序中。在这个例子中，每当你想要任何新项目时，你都会被重定向到“创建” View ，这很好，但是我想要的不是做一个完整的页面回发，而是使用 jquery.dialog 打开一个模式弹出窗口，这将允许用户插入一个新项目。

到目前为止我已经

  <script type="text/javascript">

    $(function () {

        $('#dialog').dialog({
            autoOpen: false,
            width: 400,
            resizable: false,
            title: "hi there",
            modal: true,
            buttons: {
                "Close": function () {
                    $(this).dialog("close");
                }
            }
        });
        $('#my-button').click(function () {
        $('#dialog').dialog('open');
        });}); </script>

     <div id="dialog" title="Create Album" style="overflow: hidden;">
    @Html.Partial("_CreateAlbumPartial")</div>

问题是每次都加载部分 View ，而不是通过ajax，而且我真的不知道应该将部分 View 放置在哪里。它应该位于共享位置还是包含其他 View 的文件夹中？如何更新 Controller 类以适应部分 View ？

抱歉，如果这些很容易做到，我已经进入 mvc 3 天了:)

Answer 1

尝试这样的事情:

<script type="text/javascript">
    $(function () {
        $('#dialog').dialog({
            autoOpen: false,
            width: 400,
            resizable: false,
            title: 'hi there',
            modal: true,
            open: function(event, ui) {
                //Load the CreateAlbumPartial action which will return 
                // the partial view _CreateAlbumPartial
                $(this).load("@Url.Action("CreateAlbumPartial")");
            },
            buttons: {
                "Close": function () {
                    $(this).dialog("close");
                }
            }
        });

        $('#my-button').click(function () {
            $('#dialog').dialog('open');
        });
    });
</script>
<div id="dialog" title="Create Album" style="overflow: hidden;">

我们使用了 open 函数，该函数在对话框打开时触发，在内部我们向 Controller 操作发送 AJAX 请求，该操作将返回部分内容:

public ActionResult CreateAlbumPartial()
{
    return View("_CreateAlbumPartial");
}