Question

我的Partial View中有一个Layout page，其中包含一个表单。部分视图以popup打开。提交表单后，我必须返回当前页面并打开弹出窗口，并在那里显示成功消息，但我无法返回到右侧视图。

我的布局页面

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title || Midas WebSite</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/site")
    @Scripts.Render("~/bundles/modernizr")

    <script type="text/javascript" language="javascript">
        /* Superior Web Systems */
        function displayHideBox(boxNumber) {

            if (document.getElementById("LightBox" + boxNumber).style.display == "none") {
                $("#LightBox" + boxNumber).fadeIn();
                $("#grayBG").fadeIn();
            } else {
                $("#LightBox" + boxNumber).fadeOut();
                $("#grayBG").fadeOut();
            }
        }
    </script>

</head>
<body>
    <div id="grayBG" class="grayBox" style="display:none;"></div>
    <div id="LightBox1" class="box_content" style="display:none;">
        <div onclick="displayHideBox('1'); return false;" class="close">X</div>
     @Html.Action("ActionToBindPartialView", "ControllerName")
</div>

 @RenderBody()
 @RenderSection("scripts", required: false)
 @Scripts.Render("~/bundles/jqueryval")

我的部分视图

<div id="divActions">
   // My Form Here

    @Ajax.ActionLink("Submit", "ActionName", "ControllerName", new AjaxOptions
         {
           HttpMethod = "POST",
           UpdateTargetId = "divActions",
           OnSuccess = "onSucess()" 
         })

</div>

现在我的动作代码到目前为止我已尝试过：

1

// My Code

 return PartialView("MyPartialView");

2

// My Code

return PartialView("MyPartialView", MyModel);

第3

// My Code

return View();

4

// My Code

return ParialView();

我是初学者，无法找到我做错的事。请建议我该怎么做才能完成这项工作。

Answer 1

由于我们必须讨论问题的工作空间有限，很难说你做错了什么。但是，这是一个可以帮助您的工作示例，请按照每个步骤操作：

捆绑

bundles.Add(new ScriptBundle("~/bundles/jquery")
    .Include("~/Scripts/jquery-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryval")
     .Include(
                "~/Scripts/jquery.unobtrusive*",
                "~/Scripts/jquery.validate*"));

的HomeController

public ActionResult Index()
{
    return View();
}

public PartialViewResult GetPartial()
{
    return PartialView("_MyPartial");
}

Index.cshtml

<h2>Index</h2>

<div id="divActions">
    @Ajax.ActionLink("Submit", "GetPartial", "Home", new AjaxOptions
     {
       HttpMethod = "POST",
       UpdateTargetId = "divActions",
       OnSuccess="onSuccess()"
     })
</div>

<script type="text/javascript">
    function onSuccess()
    {
        alert("Success!");
    }
</script>

_MyPartial.cshtml
```
 <h2>_MyPartial</h2>
```

_Layout.cshtml

<!DOCTYPE html>
<html>
<head>
   <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    @RenderBody()

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryval")
    @RenderSection("scripts", required: false)
</body>
</html>

要确认页面源（在浏览器中）中呈现的脚本：

 <script src="/Scripts/jquery-1.8.2.js"></script>
 <script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
 <script src="/Scripts/jquery.validate.js"></script>
 <script src="/Scripts/jquery.validate.unobtrusive.js"></script>

正如您所看到的，没有什么比这更难的了。您只需按照上述步骤操作即可。

我希望它有所帮助。

提示：检查其他脚本错误，也许您的自定义代码显示弹出窗口导致错误。仔细检查您是否在局部视图中呈现javascript。考虑将其提取到常规视图。

从布局页面中的局部视图。 MVC 5

1 个答案: