javascript - ASP.NET MVC 4 中的 Toast 通知

Question

我想在用户使用 Toastr 插件单击“添加到购物车”按钮时显示通知。基本上，当用户单击按钮时，它会执行“AddToCart”操作，然后重定向到索引页面。当页面出现时，它会检查 TempData 值，然后显示通知。

这是控制器：

public ActionResult AddToCart(int id)
    {


        TempData["message"] = "Added";
        return RedirectToAction("Index");
    }

和观点：

@if (TempData["message"] != null)
{

    <script type="text/javascript">
        $(document).ready(function () {   
            toastr.success('Added')
        })
    </script>                                 
}

根据@Exception 的回答更新它。但是，如果我使用 ajax，例如：

@Ajax.ActionLink("Add to cart", "AddToCart", "Home", new { id = item.ProductId }, new AjaxOptions { UpdateTargetId="abc"})

它不起作用。这可能是因为这条线：

$(document).ready(function ()

因为页面没有重新加载。我该如何解决？

但这不起作用。请帮忙。提前致谢！

Answer 1

答案1：

<script type="text/javascript">
    $(document).ready(function () { 
       if('@TempData["message"]' == "Added"){
          toastr.success('Added');
       }
       else{ }
    });
</script> 

答案 2：

尽管TempData在一次重定向上保留其值，但有时会产生问题（建议避免使用TempData），在这种情况下，您可以执行以下操作：

public ActionResult AddToCart(int id)
{
    .........
    return RedirectToAction("Index", new { message="Added" });  //Send Object Route//
}

public ActionResult Index(string message)
{
    .........
    if(!string.IsNullOrEmpty(message)) {
       Viewbag.message=message;
    }
    return View();
}

<script type="text/javascript">
    $(document).ready(function () { 
       if('@Viewbag.message' == "Added") {
          toastr.success('Added');
       }
       else{ }
    });
</script>

Answer 2

控制器

TempData["message"] = "Added";

看法

    @section scripts
{
        <script >
            $(document).ready(function () {
                if ('@TempData["message"]' == "Added") {
                    toastr.success('Action successfully changed....', 'ActionName');
                }
                else { }
            });
    </script>
}

Answer 3

尝试在 Index Method 中添加 ViewBag 语句，其中包含一个 TempData 变量：

....
ViewBag.message = TempData["message"];
....
return View();

索引.cshtml：

@if (ViewBag.message != null)

{

<script type="text/javascript">
    $(document).ready(function () {   
        toastr.success('Added')
    })
</script>                                 

}

Answer 4

此链接可能会有所帮助：https ://github.com/fatihBulbul/toastr.Net

服务器端：

public ActionResult Index()
    {
        ViewBag.Message =  Notification.Show("Hello World", position: Position.BottomCenter, type: ToastType.Error, timeOut: 7000);
        return View();
    }

客户端 ：

    <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
    <link href="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet" />

     @Html.Raw(ViewBag.Message)