Question

我想在用户点击索引页面上的“添加新”按钮时呈现视图。我在控制器中有一个Action来处理Create post。这里的问题是我无法加载视图。当我点击“添加新”按钮时，没有任何反应。有人可以指出我在这里缺少什么吗？

这是我的索引视图的样子：

<script type="text/javascript">

    $(function () {
        $('#dialog').dialog({
            autoOpen: false,
            width: 400,
            resizable: false,
            title: 'Add New Item',
            modal: true,
            open: function (event, ui) {
                $(this).load('@Url.Action("Country/Create")');
            },
            buttons: {
                "Close": function () {
                    $(this).dialog("close");
                }
            }
        });

        $('#AddNew').click(function () {
            alert('Hello');
            $('#dialog').dialog('open');
        });
    });
</script>

<button id="AddNew" type="button">Add New</button>

<div id="dialog" style="overflow: hidden;">

</div>

脚本参考：

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

Layout.cshtml

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>


    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>


</head>

<body>
    @RenderBody()
</body>
</html>

- 解决方案 -

我缺少jquery.ui.all.css参考。

<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />

Answer 1

I **think** your file order is wrong

jquery-1.5.1.min.js
jquery-ui-1.8.11.min.js

now other files

-------------我认为您的网址格式也错误---------

@Url.Action("Action","Cortoller");
@Url.Action("Create","Country");
$(this).load('@Url.Action("Create","Country")');

Answer 2

尝试将您的Javascript代码放在

之间

$(document).ready(function () {
...
});

无法在模态弹出窗口mvc 3中打开视图

2 个答案: