0

我有一个正在开发的 Web 应用程序，它使用部分视图来呈现愿望清单。我希望这个 PartialView 在主页面的 div 中呈现。愿望清单内容保存在 HttpContext.Profile 对象中以保持持久性。

在局部视图控制器中有添加和删除功能，理想情况下，一旦执行，就会触发索引操作的刷新。

我能够在 div 中呈现部分视图，在任何正在执行的操作上，但是整个页面被重定向到结果页面而不是重新加载 div，我不知道如何实现这一点

控制器：

public ActionResult Index()
{
    var wish = WishListForm;

    //Perform lookup of any object id's located in the profile.
        if (wish.Properties.Any())
        {
            viewModel.Items = Nav.GetItems(wish.ItemIds).ToList();
        }
        return PartialView("RequestFormPartial", viewModel);
    }

    public ActionResult AddItem(int itemId)
    {
        var wish = WishListForm;
        if (!wish.Properties.Contains(itemId))
        {
            wish.Properties.Add(itemId);
        }
        WishListForm = wish;
        return RedirectToAction("Index");
    }

    public ActionResult RemoveItem(int itemId)
    {
        var wish = WishListForm;
        if (wish.Properties.Contains(itemId))
        {
            wish.Properties.Remove(itemId);
        }
        WishListForm = wish;
        return RedirectToAction("Index");
    }

    public ActionResult RemoveAllItems()
    {
        var wish = WishListForm;
        wish.Properties.RemoveAll(x => true);
        WishListForm = wish;
        return RedirectToAction("Index");
    }
}

Html 愿望清单

<script>
    $('#wishListTest').click(function () {
        $.ajax({
            type: 'POST',
            url: '@Url.Action("Index", "MyData")',
            success: function (data) {
                $("#wishlist").html(data);
            }
        });
    });
</script>

我认为必须更改的是 RedirectToAction 吗？有任何想法吗？

4

1 回答 1

1

您可能只想重新加载部分视图。不是整个页面。您可以做的是，如果您的 Add 请求来自 ajax 调用，则返回部分视图的内容。

因此，让我们对 action 方法进行一个小更新，以检查调用是否为 ajax 调用。

[HttpPost]
public ActionResult AddItem(int itemId)
{
    var wish = WishListForm();
    if (!wish.Properties.Contains(itemId))
    {
        wish.Properties.Add(itemId);
    }
    WishListForm = wish;
    if(Request.IsAjaxRequest())
    {
        //return the viewmodel with Items loaded
        var vm=new YourWishListViewModel();

        if (wish.Properties.Any())
        {
           vm.Items = Nav.GetItems(wish.ItemIds).ToList();
        }
        return PartialView("RequestFormPartial", vm);
    }
    else
    {
        return RedirectToAction("Index");
    }
}

还要确保防止按钮单击的默认行为（它可能会提交表单）。您可以使用该preventDefault方法来做到这一点。

$('#wishListTest').click(function (e) {
   e.preventDefault();
   // your ajax posting code goes here
});
于 2013-06-03T21:25:36.290 回答