单击时在主视图中加载局部视图

Question

I'm trying to get a partial view to load on my current view when the user clicks the link but it keeps loading the partial view rather then on the same view.

Not sure what I'm missing.

Main View Controller

    public PartialViewResult MonitorDetail(MonitorType mType)
    {
        return PartialView("MonitorDetail", mType);
    }

Main View

<script src="~/Scripts/jquery-2.1.1.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>

<p class="lbutton radius">
    @Ajax.ActionLink("SQL Cluster Online ", "MonitorDetail", "NOCCon", MonitorType.AHSSQLCluster, new AjaxOptions() { UpdateTargetId = "monitorDetail" })
    <span class="lbutton-addition @(Model.SQLClusterOnline ? "online" : "offline")">
        @(Model.SQLClusterOnline ? "Online" : "Offline")
    </span></p>

<div id="monitorDetail"></div>

Partial View

@model PAL.Intranet.MonitorType
<div>
    You choose @Model.ToString()
</div>

Also keeps telling me mType is null but i'm passing it MonitorType in the ActionLink so I added it as nullable so I can try and figure out the first issue and then work on the second.

Answer 1

If its displaying only the partial view, its because you have not included the required files for Ajax.ActionLink to work (and its just performing a normal redirect). Ensure you have included jquery.{version}.js and jquery.unobtrusive-ajax.js

The reason parameter mType is null is because you are not passing a value. It should be

@Ajax.ActionLink("SQL Cluster Online ", "MonitorDetail", "NOCCon", new { mtype = MonitorType.AHSSQLCluster }, new AjaxOptions() ....)