部分视图重定向而不是填充 div

Question

我正在尝试建立一种关系，您单击网格 1 中的采购订单，网格 2 将显示相关项目。我一直在研究并尝试了几种不同的方法。我当前的链接是：

@Ajax.ActionLink("Select", "DisplayPOItems", new { id = Model.poList[0].ID }, new AjaxOptions
{
     UpdateTargetId = "POItems",
     HttpMethod = "GET",
     InsertionMode = InsertionMode.Replace,
})

我也尝试了一个操作链接：

$("#POSelect").click(function () {
     $.get('@Url.Action("DisplayPOItems","PO", new { id = Model.ID })', function () {
     $('#POItems').load(this.href);
     return false;
     });
});

或使用 ajax 的类似块来捕获单击事件并尝试以这种方式将部分视图填充到我的表单上的 div 中。所有这些方法都填充了数据，但它总是重定向到 .../PO/DisplayPOItems/1 并在那里只显示部分视图。这是我的控制器：

public PartialViewResult DisplayPOItems(int ID)
{
     ItemModel im = new ItemModel();
     return PartialView("_GridItem", im.POSearchResult(ID));
}

我也在控制器上尝试过 ActionResult 但没有帮助。如何让页面不重定向，而只用我的部分视图填充表单上的 div？

Answer 1

如果您决定使用Ajax.ActionLink，请确保您在页面中引用了jquery.unobtrusive-ajax.js 脚本：

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

如果您决定使用普通的 jQuery，请确保您发送一个 AJAX 请求，而不是像现在这样发送两个。还要确保你在正确的地方返回 false：

$('#POSelect').click(function () {
     var url = '@Url.Action("DisplayPOItems", "PO", new { id = Model.ID })';
     $.get('url', function (result) {
         $('#POItems').html(result);
     });
     return false;
});

或者它的等价物：

$('#POSelect').click(function () {
     var url = '@Url.Action("DisplayPOItems", "PO", new { id = Model.ID })';
     $('#POItems').load(url);
     return false;
});

或者如果您的链接已经包含正确的网址：

$('#POSelect').click(function () {
     $('#POItems').load(this.href);
     return false;
});

Answer 2

几天前我正在处理同样的问题，我只是想添加到上面的答案，并且是使用 AJAX。

您需要在要呈现其他部分视图的主视图页面中运行两个 java 脚本。仅在我的应用程序中使用 unobtrusive-ajax dint 帮助。

这里是脚本。

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

你的视图页面也需要这个

@using (Ajax.BeginForm("Search", new AjaxOptions() { UpdateTargetId = "results" }))
    {

目标 id 将在 div 标签中

<div id="results">
@renderpartial("results")
</div>

这有助于在不重新加载整个页面的情况下获取内容。但我面临这个问题。我实际上无法重定向到另一个视图（重定向到其他控制器操作并进入其视图），但部分页面加载工作正常。我的意思是控制去了那里，但又回到了同一个视图，而不是移动到其他视图。

希望这会有所帮助。

Answer 3

我有一个用于这类事情的 jQuery 插件。

$ ->
    $.fn.LoadViewInline = (url,target,useInline,callback) ->
        #debugger
        $.disableEventPropagation(event);
        if(!url)
            url = $(this).data("inline-url")
        if(!useInline)
            useInline = $(this).data("inline")
        if useInline == "True" or useInline == true 
            if(!target)
                target = $(this).data "inline-target"
            if(!targetSelectorPrefix)
                targetSelectorPrefix = "#"
            $(targetSelectorPrefix + target).load url, callback
        else
            window.location.href = url
        return false

使用类似的东西：

@Html.ActionLink("Add a Claimant", "Index", "Property", 
    new RouteValues().With("fnolid", Fnolid),
    HtmlValues.WithClass("header")
    .Data("inline-url", dataInlineNewClaimantUrl)
    .Data("inline-target", dataInlineTarget)
    .Data("inline", dataInline)
    .With("onclick", "return $(this).LoadViewInline();")