目标
当添加一些用户时,我想在我的视图中显示一些消息。
问题
当我们的模型出现问题时,有一个方法 ( ModelState.AddModelError
) 来处理不成功的消息。但是,当一切顺利时,我们如何处理给用户的消息说他的操作成功了?
我找到了这个提供解决方案的线程,但是大约三年过去了,我需要知道:没有其他方法,也许更成熟?不是说这不是,但我们仍然以同样的方式处理成功消息?
当添加一些用户时,我想在我的视图中显示一些消息。
当我们的模型出现问题时,有一个方法 ( ModelState.AddModelError
) 来处理不成功的消息。但是,当一切顺利时,我们如何处理给用户的消息说他的操作成功了?
我找到了这个提供解决方案的线程,但是大约三年过去了,我需要知道:没有其他方法,也许更成熟?不是说这不是,但我们仍然以同样的方式处理成功消息?
从Brad Christie 的 回答中扩展,我创建了一个 NuGet 包BootstrapNotifications,它将通过内置的 Bootstrap3 支持为您执行此操作。这个包还支持多种通知类型(错误、警告、成功和信息),带有预先设置的警报,并且易于扩展。
该扩展优雅地支持同一类型和不同类型的每个请求的多个通知。
NotificationExtensions.cs:
public static class NotificationExtensions
{
private static IDictionary<String, String> NotificationKey = new Dictionary<String, String>
{
{ "Error", "App.Notifications.Error" },
{ "Warning", "App.Notifications.Warning" },
{ "Success", "App.Notifications.Success" },
{ "Info", "App.Notifications.Info" }
};
public static void AddNotification(this ControllerBase controller, String message, String notificationType)
{
string NotificationKey = getNotificationKeyByType(notificationType);
ICollection<String> messages = controller.TempData[NotificationKey] as ICollection<String>;
if (messages == null)
{
controller.TempData[NotificationKey] = (messages = new HashSet<String>());
}
messages.Add(message);
}
public static IEnumerable<String> GetNotifications(this HtmlHelper htmlHelper, String notificationType)
{
string NotificationKey = getNotificationKeyByType(notificationType);
return htmlHelper.ViewContext.Controller.TempData[NotificationKey] as ICollection<String> ?? null;
}
private static string getNotificationKeyByType(string notificationType)
{
try
{
return NotificationKey[notificationType];
}
catch (IndexOutOfRangeException e)
{
ArgumentException exception = new ArgumentException("Key is invalid", "notificationType", e);
throw exception;
}
}
}
public static class NotificationType
{
public const string ERROR = "Error";
public const string WARNING = "Warning";
public const string SUCCESS = "Success";
public const string INFO = "Info";
}
_Notifications.cshtml:
@using YourApp.Extensions
@{
var errorList = Html.GetNotifications(NotificationType.ERROR);
var warningList = Html.GetNotifications(NotificationType.WARNING);
var successList = Html.GetNotifications(NotificationType.SUCCESS);
var infoList = Html.GetNotifications(NotificationType.INFO);
}
<!-- display errors -->
@if (errorList != null)
{
<div class="alert alert-danger alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
@if(errorList.Count() > 1){
<strong><span class="glyphicon glyphicon-remove"></span> There are @errorList.Count() errors: </strong>
<ul>
@foreach (String message in errorList)
{
<li>@Html.Raw(message)</li>
}
</ul>
}
else{
<strong><span class="glyphicon glyphicon-remove"></span> Error: </strong>
@Html.Raw(errorList.First())
}
</div>
}
<!-- display warnings -->
@if (warningList != null)
{
<div class="alert alert-warning alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
@if(warningList.Count() > 1){
<strong><span class="glyphicon glyphicon-warning-sign"></span> There are @warningList.Count() warnings: </strong>
<ul>
@foreach (String message in warningList)
{
<li>@Html.Raw(message)</li>
}
</ul>
}
else{
<strong><span class="glyphicon glyphicon-warning-sign"></span> Warning: </strong>
@Html.Raw(warningList.First())
}
</div>
}
<!-- display success -->
@if (successList != null)
{
<div class="alert alert-success alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
@if(successList.Count() > 1){
<strong><span class="glyphicon glyphicon-ok"></span> There are @successList.Count() successful notifications: </strong>
<ul>
@foreach (String message in successList)
{
<li>@Html.Raw(message)</li>
}
</ul>
}
else{
<strong><span class="glyphicon glyphicon-ok"></span> Success! </strong>
@Html.Raw(successList.First())
}
</div>
}
<!-- display success -->
@if (infoList != null)
{
<div class="alert alert-info alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
@if(infoList.Count() > 1){
<strong><span class="glyphicon glyphicon-info-sign"></span> There are @infoList.Count() notifications: </strong>
<ul>
@foreach (String message in infoList)
{
<li>@Html.Raw(message)</li>
}
</ul>
}
else{
<strong><span class="glyphicon glyphicon-info-sign"></span> </strong>
@Html.Raw(infoList.First())
}
</div>
}
要查看所有这些代码及其使用方式,您可以从github下载完整的工作演示。
有几种方法可以给这只猫剥皮。您可以使用 ViewBag:
ViewBag.SuccessMessage = "<p>Success!</p>";
然后在您的视图中,您可以将其呈现到页面:
@ViewBag.SuccessMessage
我不是 ViewBag 的粉丝,所以我通常会创建一个 ViewModel 对象来保存我的特定视图所需的所有数据。成功消息就是这样的数据:
public MyViewModel{
public bool IsSuccess {get;set;}
}
然后在您的控制器中,您会将此 ViewModel 传递给您的强类型视图
[HttpPost]
public ActionResult Update(MyViewModel vm){
//Glorious code!
return View(vm)
}
最后,只需在您的视图中检查它并在成功时打印一条消息:
@if(vm.IsSuccess){
<p>Here is an amazing success message!</p>
}
此外,您可以使用 TempData 代替它,它的工作方式与 ViewBag 类似,但仅持续到您的下一个请求结束,然后被丢弃:
TempData["SuccessMessage"] = "Success!";
TempData
为了通知用户而将一次性交给 UI 并不是一种糟糕的方式。关于它们的重要部分是它们在动作调用之间持续存在,但一旦被读取就会被删除。所以,如果只是传递一个“它有效”的信息,它就很好用。
您可以通过多种方式将它们联系起来,但我会给您一个通用示例来帮助您:
public static class NotificationExtensions
{
private const String NotificationsKey = "MyApp.Notifications";
public static void AddNotification(this ControllerBase controller, String message)
{
ICollection<String> messages = controller.TempData[NotificationsKey] as ICollection<String>;
if (messages == null)
{
controller.TempData[NotificationsKey] = (messages = new HashSet<String>());
}
messages.Add(message);
}
public static IEnumerable<String> GetNotifications(this HtmlHelper htmlHelper)
{
return htmlHelper.ViewContext.Controller.TempData[NotificationsKey] as ICollection<String> ?? new HashSet<String>();
}
}
现在,您可以在您的操作中调用this.AddNotification("User successfully added!");
并在您的视图中使用以下命令显示它们:
@foreach (String notification in Html.GetNotifications())
{
<div class="notification">
<p>@notification/p>
<i class="icon-close"></i>
</div>
}
(...或类似的东西)可以有效地放置在您的主视图中,并用作执行任何操作的一般通知方法。(就像 StackOverflow 在某些事件期间在页面顶部显示金条的方式一样)。
一个很好的解决方案是TempData
集合。它的值在请求结束时被清除,这使其成为一次性消息的理想选择,例如通知用户某事成功。
控制器
TempData["Message"] = "Operation successful!";
看法
@TempData["Message"]
是的,这仍然是目前最好的方法。
从概念上讲,我认为答案仍然成立。如果消息是视图的组成部分,它应该是ViewModel
. TempData
是在不修改定义的情况下传递数据的快捷方式ViewModel
,有些人对此不以为然。