在MVC中提供用户通知/确认的建议方法是什么? [英] What is the recommended approach to providing user notifications / confirmations in MVC?
问题描述
我遇到的一个常见情况是在用户执行动作以通知他们成功后提供通知/确认。
A common scenario I encounter is providing notifications / confirmations to users after they have performed an action to inform them of success.
例如,假设用户提供反馈在反馈表单上,然后点击提交反馈。您可能希望在之后显示感谢您的反馈消息,您已经执行了一些验证,例如他们在数据库中有一个有效的电子邮件。一些伪代码:
For example, suppose a user provides feedback on a feedback form and then clicks Submit Feedback. You may want to display a 'Thanks for your Feedback' message after you have performed some validation e.g. they have a valid email in the database. Some pseudocode:
public ActionResult SubmitFeedback(string Feedback, int UserID)
{
MyDataContext db = new DataContext()
if(db.usp_HasValidEmail(UserID)) //Check user has provided a valid email
return View("Index"); //Return view and display confirmation
else
ModelState.AddModelError("InvalidEmail", "We do not hold an email record for you. Please add one below");
return View("Index);
}
我明白如何验证条目通过使用 Html.ValidationMessage
等。这很好,我通常检查无效的条目,使用客户端的jQuery或我的Action早期(即在我开始击中数据库),并且如果有无效条目,则退出我的操作。
I understand how to validate entries by using Html.ValidationMessage
etc. This is fine and I typically check for invalid entries either using jQuery on the client side or early in my Action (i.e. before I start hitting the database) and exit my action if there are invalid entries.
但是,所有条目都有效并且要显示确认消息的情况如何?
However, what about the scenario where all entries are valid and you want to display a confirmation message?
选项1 :完全独立的视图
似乎违反了DRY原则,通过拥有一个全新的View(和ViewModel)来显示几乎相同的信息,期望用户通知。
This seems to violate DRY principles by having an entirely new View (and ViewModel) to display almost identical information, expect for the user notifcation.
选项2 :视图中的条件逻辑
在这种情况下,我可以在View中有条件语句来检查某些TempData是否存在是通过在 SubmitFeedback
操作中。再次,伪代码:
In this scenario I could have a conditional statement in the View that checks for the presence of some TempData that is passed in the SubmitFeedback
Action. Again, pseudocode:
<% if(TempData["UserNotification"] != null {%>
<div class="notification">Thanks for your Feedback!</div>
<% } %>
选项3 :使用jQuery查看页面加载中的TempData
在这种情况下,我将有一个隐藏的字段,我将通过 SubmitFeedback
Action填充TempData,然后我将使用jQuery来检查隐藏的字段值。伪码:
In this scenario I would have a hidden field that I would populate with TempData via the SubmitFeedback
Action. I would then use jQuery to check the hidden field value. More pseudocode:
<%=Html.Hidden("HiddenField", TempData["UserNotification"])%> //in View
$(document).ready(function() {
if ($("input[name='HiddenField']").length > 0)
$('div.notification').show();
setTimeout(function() { $('div.notification').fadeOut(); }, 3000);
});
我的初步想法是:
-
选项1:完全分离视图,但看起来像是过度杀戮和低效(违反DRY) - 选项2:简单,但有条件视图中的逻辑(不要在MVC的祭坛上为此牺牲?)
- 选项3:感觉像是过于复杂的事情。它确实避免了View中的逻辑。
- Option 1: Complete separation of Views but seems like overkill and inefficient (violates DRY)
- Option 2: Simple enough, but has conditional logic in the View (don't I get sacrificed at the MVC altar for this?!?)
- Option 3: Feels like it is overcomplicating things. It does avoid logic in View though.
你说什么?选项1,2,3或无?有没有更好的办法?
What say you? Option 1,2,3 or none? Is there a better way?
请增加我的编码模式!
推荐答案
我喜欢选项1另外你不需要条件,它与javascript禁用。只要把它粘在主页的某个地方就可以了。
I like option 1. Also you don't need conditions and it works with javascript disabled. Just stick it somewhere in the masterpage and it should be OK:
<div class="notification">
<%= Html.Encode(TempData["Notification"]) %>
</div>
您当然可以通过使用一些漂亮的插件(例如 jGrowl 或 Gritter 或者甚至查看 StackOverflow如何操作。
You could of course progressively enhance/animate this by using some nice plugin such as jGrowl or Gritter or even look at how StackOverflow does it.
另一个解决方案是编写一个可能最整洁的帮手:
Another solution is to write a helper which is probably the neatest:
public static class HtmlExtensions
{
public static MvcHtmlString Notification(this HtmlHelper htmlHelper)
{
// Look first in ViewData
var notification = htmlHelper.ViewData["Notification"] as string;
if (string.IsNullOrEmpty(notification))
{
// Not found in ViewData, try TempData
notification = htmlHelper.ViewContext.TempData["notification"] as string;
}
// You may continue searching for a notification in Session, Request, ... if you will
if (string.IsNullOrEmpty(notification))
{
// no notification found
return MvcHtmlString.Empty;
}
return FormatNotification(notification);
}
private static MvcHtmlString FormatNotification(string message)
{
var div = new TagBuilder("div");
div.AddCssClass("notification");
div.SetInnerText(message);
return MvcHtmlString.Create(div.ToString());
}
}
然后在你的主人: / p>
And then in your master:
<%= Html.Notification() %>
这篇关于在MVC中提供用户通知/确认的建议方法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!