使用Jquery调用控制器操作
当用户向购物车添加项目时，我试图重新加载特定的“div”()。我有一些Jquery，我想在click事件上运行它。它需要调用post操作(正在工作)，然后重新加载“重新加载”div中的所有内容(仅是呈现操作)。
这个重新加载部分似乎也工作，但不只是重新加载div，但也是当前页面的一部分。考虑到这一点，肯定是jquery不正确。对我所做的错事的任何帮助都将不胜感激。
我将尝试只包括以下必要的代码：
在布局视图中加载部分视图：
<div id="reload">
@{Html.RenderAction("_PartialView","Controller");}
</div>链接用户单击。单击Jquery侦听的事件：
<p class="button">
<a href="#" class="AddToCart" data-id="@item.ItemId"> Add To Basket</a>
</p>Jquery对click事件调用的操作：
[ChildActionOnly]
public ActionResult _CartSummary()
{
var cart = ShoppingCart.GetCart(this.HttpContext);
ViewData["CartCount"] = cart.GetCount();
return PartialView("_CartSummary.cshtml");
}JQuery调用单击事件：
$(function () {
$(".AddToCart").click(function () {
var addToCart = $(this).attr("data-id");
if (addToCart != '') {
$.post("/ShoppingCart/AddToCart", { "id": addToCart }).success(function() {
$("#cartSummary").fadeOut();
$("#cartSummary").fadeIn().load('@Url.Action("_CartSummary","ShoppingCart")');
});
return false;
};
});
});当调用上面的JQuery时，$("#cartSummary").fadeIn().load('@Url.Action("_CartSummary","ShoppingCart")')返回的url是localhost/Store/@Url.Action(%22_CartSummary%22,%22ShoppingCart%22。正如预期的那样，未找到此url。正确的url应该是localhost/ShoppingCart/_CartSummary。似乎@Url.Action没有被处理，只是作为该操作的名称传入。
回答 3
Stack Overflow用户
发布于 2014-11-30 17:50:16
因此，在玩这个问题，并使用提供的答案作为基础，我有一个工作的解决方案，我很满意。这绝对不是最干净的方法，我相信，但结果是我想要的。希望这能对未来的人有所帮助。
视图中的Jquery：
<script>
$(function () {
//On click of .AddToCart
$(".AddToCart").click(function () {
// Get the id from the link
var addToCart = $(this).attr("data-id");
if (addToCart != '') {
$.post("/ShoppingCart/AddToCart", { "id": addToCart }).success(function (data) {
$('#cart-status').fadeIn().html('Cart ' + '<span class="badge">' + data.CartCount + '</span>');
});
return false;
};
});
});
</script>部分视图中的代码
<ul class="nav navbar-nav" style="margin-top:-15px;">
<li><a href="/ShoppingCart?Length=12" id="cart-status">Cart <span class="badge">@ViewData["CartCount"]</span></a></li>
</ul>最后，控制器：
public ActionResult AddToCart(int id)
{
//Code...
var results = new ViewModel
{
Message = Server.HtmlEncode(addedItemName) +
" has been Added to your shopping cart.",
CartCount = cart.GetCount(),
};
return Json(results);
}Stack Overflow用户
发布于 2014-11-29 18:58:42
当您使用load时，它需要指向一个部分。喜欢
$("#cartSummary").fadeIn().load('@Url.Action("_PartialView", "Controller")');最后，当您发送一个$.post()时，请记住它是异步的。更好的办法可能是：
$.post("/ShoppingCart/AddToCart", { "id": addToCart }).success(function () {
$("#cartSummary").fadeIn().load('@Url.Action("_PartialView", "Controller"'));
});如果您的jQuery是在一个单独的文件中(应该是这样)，那么在*.cshtml中这样做。
<div id="cartSummary" data-url="@Url.Action("_PartialView", "Controller")"></div>在jQuery中：
$("#cartSummary").fadeIn().load($("#cartSummary").data("url"));基本技术是将HTML视为存储库。这就是我们存储来自服务器的所有动态信息的地方。
Stack Overflow用户
发布于 2014-11-29 19:06:04
$(document).ready(function () {
$(".AddToCart").click(function () {
var addToCart = $(this).attr("data-id");
if (addToCart != '')
{
$.post("/ShoppingCart/AddToCart", { "id": addToCart },function(data){
$("#cartSummary").html(data);
$("#cartSummary").fadeOut();
return false;
});
}
});
});https://stackoverflow.com/questions/27205734
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号