Question

我想一次同步双方的通知计数器。附件中的图片可以让您轻松了解我需要做的事情，我将在几天内陷入困境。

图像： Sync notifications

通知铃声的右侧位于布局：

 <div class="header-top">
                <h2 style="width:100%">@ViewBag.Heading</h2>
                <a class="info sprite" id="lnkInfo"></a>
                @{
                    if(ViewBag.ShowNotification != null && ViewBag.ShowNotification) {
                        <span class="notifications-icon"><em>@ViewBag.NotificationCount</em></span>
                    }
                }
            </div>

左通知铃声在视野中。代码：

 <div class="head">
    <span class="notifications-icon"><em>@Model.Announcement.Count</em></span>

    <h3>Notifications</h3>
</div>

Jquery Ajax调用Controller Action：

 function UpdateNotification(id) {
        var json = { "AnnouncementID": id };
        $.ajax({
            type: 'POST',
            url: '@Url.Action("UpdateNotificationData", "Home")',
            contentType: 'application/json; charset=utf-8',
            data: '{"AnnouncementID":' + id + '}',
            dataType: 'json',
            cache: false,
            success: function (data) {
                if (data) {
                    updatenotificationUI(id);
                }
            }
        })
    }

function updatenotificationUI(id) {
        var $notificaitonContainer = $(".notifications");

        if (id != null) {
            var $li = $notificaitonContainer.find("li[id=" + id + "]");

            if ($li != null) {
                $li.slideUp("slow", function () {
                    $(this).remove();
                    var legth = $notificaitonContainer.find("#listing li").length;
                    if (legth > 0)
                        $notificaitonContainer.find("em").html(legth);
                    else
                        $notificaitonContainer.find("em").html("");
                });
            }
        }
        else {
            $notificaitonContainer.find("ul").html("");
            $notificaitonContainer.find("em").html("");

        }
    }

家庭控制器：

public ActionResult UpdateNotificationData(string AnnouncementID)
    {
        var announcements = new AnnouncementResponse() { Announcement = new List<Announcement>() };

        if (IsUserAuthenticated)
            return RedirectToAction("Index", "Account");

        announcements = _contentManager.Announcement();

        var item = announcements.Announcement.Where(p => p.AnnouncementID == Convert.ToInt32(AnnouncementID)).FirstOrDefault();

        announcements.Announcement.Remove(item);
        ViewBag.NotificationCount = announcements.Announcement.Count;

        return Json(new { success = true });
    }

但布局中的通知响铃不会使用viewbag值进行更新，甚至在为模型分配模型时也不会更新。

请为此提供解决方案。

Answer 1

您只需更新两个通知中的一个。首先，您找到一个包含元素：

var $notificaitonContainer = $(".notifications");

问题中的HTML没有任何符合此要求的元素，因此我无法更具体。但仅仅基于命名，听起来就像你假设只有一个这样的容器。

无论如何，您只需选择一个要更新的元素：

var $li = $notificaitonContainer.find("li[id=" + id + "]");

（这不能超过一个元素，因为id值必须是唯一的。）

所以...在你的页面上你有两个＆＃34;通知＆＃34;元素。您正在更新一个。那么，解决方案就是更新另一个。但是，您确定HTML中的元素（jQuery有许多用于标识元素或元素集的选项），您的updatenotificationUI函数只需更新两者。

在mvc 4中更新通知计数器

1 个答案: