asp.net-mvc – 通知面板类似于stackoverflow的

记住在页面顶部显示的小div，以通知我们的东西(如新徽章)？

我想实现类似的东西，并寻找一些最佳做法或模式。

我的网站也是一个ASP.NET MVC应用程序。理想情况下，答案将包括“把这个放在主页”和“在控制器中做这个”的细节。

只是为了节省你不必看看自己，这是我看到的欢迎消息，当你没有登录在stackoverflow的代码。

<div class="notify" style="">
  <span>
    First time at Stack Overflow? Check out the
    <a href="/messages/mark-as-read?returnurl=%2ffaq">FAQ</a>!
  </span>
  <a class="close-notify" onclick="notify.close(true)" title="dismiss this notification">×</a>
</div>

<script type="text/javascript">

  $().ready(function() {
    notify.show();
  });

</script>

我想补充一点，我完全理解这一点，也理解jquery的参与。我只是感兴趣谁把代码放入标记和什么时候(“谁”在ASP.NET MVC应用程序中的实体)。

谢谢！

解决方法

以下通知容器始终位于视图标记中：

<div id="notify-container"> </div>

默认情况下隐藏通知容器，并且在某些情况下由javascript填充。它可以包含任意数量的消息。

如果用户未登录

持久性：Cookie用于跟踪是否显示消息。

服务器端生成的代码在视图中：
我认为stackoverflow只显示一个消息，如果你没有登录。以下代码注入到视图：

<script type="text/javascript">
    $(function() { notify.showFirstTime(); });
</script>

showFirstTime()javascript方法只是决定是否显示“这是你的第一次在这里吗？消息，基于是否设置了cookie。如果没有cookie，则显示消息。如果用户采取操作，则设置Cookie，并且该邮件将来不会显示。 nofity.showFirstTime()函数处理检查cookie。

如果用户已登录

持久性：数据库用于跟踪是否显示消息。

服务器端生成的代码在视图中：
当请求页面时，服务器端代码检查数据库以查看需要显示哪些消息。服务器端代码然后将json格式的消息注入视图，并对javascript调用showMessages()。

例如，如果我登录到一个视图，我在标记中看到以下SO：

<script type="text/javascript">
1
2 var msgArray = [{"id":49611,"messageTypeId":8,"text":"Welcome to Super User! Visit your u003ca href="/users/00000?tab=accounts"u003eaccounts tabu003c/au003e to associate with our other websites!","userId":00000,"showProfile":false}];
3 $(function() { notify.showMessages(msgArray); });
4
</script>

因此，如果用户没有登录或者注入消息并为登录用户调用“showMessages”，服务器端代码将注入代码来调用“showFirstTime”方法。

更多关于客户端代码

另一个关键组件是“通知”JavaScript模块Picflight已经de-minified(你可以做同样使用yslow的firebug)。通知模块基于服务器端生成的javascript来处理通知div的填充。

未登录，客户端

如果用户未登录，则模块在用户X退出通知时处理事件，或通过创建Cookie转到常见问题解答。它还确定是否通过检查cookie来显示第一时间消息。

登录，客户端

如果用户已登录，则通知模块将服务器生成的所有消息添加到通知div中。它也很可能在用户关闭消息时使用ajax来更新数据库。

（编辑：安卓应用网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!