在当前页面上插入局部视图而不是重定向

时间:2013-06-28 10:47:38

标签: c# .net asp.net-mvc asp.net-mvc-4 razor

基本上我正试图通过AJAX请求返回部分视图。然而,问题是页面被重定向到局部视图而不是替换当前页面上的内容。

以下是我发送AJAX请求的视图:

@model MediaProfits.Models.DomainEntities.ProtectedPassword

@Scripts.Render("~/Scripts/CustomScripts/LeadChecker.js")
@{
    ViewBag.Title = "Unlock " + @Model.Name;
}

<h2>Unlock @Model.Name</h2>

<button onclick="StartCheckingLead('@Model.SubId');">Start Checking</button>

@using (Ajax.BeginForm("Lead", "Check", 
    new AjaxOptions() 
    { 
        HttpMethod = "get", 
        InsertionMode = InsertionMode.Replace, 
        UpdateTargetId = "password" 
    })) 
{
    @Html.HiddenFor(m => m.SubId) 
    <input type="submit" value="Check For Completion" />
}

@Html.Partial("_Password", "")

以下是返回局部视图的控制器操作:

public PartialViewResult Lead(string subId)
    {
        var lead = db.Leads.Where(l => l.SubId == subId);
        if (lead.ToList().Count > 0)
        {
            return PartialView("~/Views/Passwords/_Password.cshtml", "unlocked...");
        }
        else
        {
            return PartialView("~/Views/Passwords/_Password.cshtml", "");
        }
    }

这是局部视图(页面现在被重定向到):

@model System.String
<div id="password">
    <label>Password:</label>
    <label>@Model</label>
</div>

最后这是我的BundleConfig.cs文件:

using System.Web;
using System.Web.Optimization;

namespace MediaProfits
{
    public class BundleConfig
    {
        // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

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

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

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

            bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
                        "~/Content/themes/base/jquery.ui.core.css",
                        "~/Content/themes/base/jquery.ui.resizable.css",
                        "~/Content/themes/base/jquery.ui.selectable.css",
                        "~/Content/themes/base/jquery.ui.accordion.css",
                        "~/Content/themes/base/jquery.ui.autocomplete.css",
                        "~/Content/themes/base/jquery.ui.button.css",
                        "~/Content/themes/base/jquery.ui.dialog.css",
                        "~/Content/themes/base/jquery.ui.slider.css",
                        "~/Content/themes/base/jquery.ui.tabs.css",
                        "~/Content/themes/base/jquery.ui.datepicker.css",
                        "~/Content/themes/base/jquery.ui.progressbar.css",
                        "~/Content/themes/base/jquery.ui.theme.css"));
        }
    }
}

我希望将部分视图插入当前页面 - 而不是重定向到它。

1 个答案:

答案 0 :(得分:1)

确保您已将jquery.unobtrusive-ajax.js脚本包含在您的页面中(在jquery之后):

<script type="text/javascript" src="@Url.Content("~/scripts/jquery.unobtrusive-ajax.js")"></script>

由于您使用的是捆绑包,因此您可以在视图的脚本部分中添加~/bundles/jqueryval捆绑包:

@section scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

这显然假设您在布局中定义了此scripts部分:

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