Syncfusion.AspNetMvc.Notifications
34.1.31
Prefix Reserved
dotnet add package Syncfusion.AspNetMvc.Notifications --version 34.1.31
NuGet\Install-Package Syncfusion.AspNetMvc.Notifications -Version 34.1.31
<PackageReference Include="Syncfusion.AspNetMvc.Notifications" Version="34.1.31" />
<PackageVersion Include="Syncfusion.AspNetMvc.Notifications" Version="34.1.31" />
<PackageReference Include="Syncfusion.AspNetMvc.Notifications" />
paket add Syncfusion.AspNetMvc.Notifications --version 34.1.31
#r "nuget: Syncfusion.AspNetMvc.Notifications, 34.1.31"
#:package Syncfusion.AspNetMvc.Notifications@34.1.31
#addin nuget:?package=Syncfusion.AspNetMvc.Notifications&version=34.1.31
#tool nuget:?package=Syncfusion.AspNetMvc.Notifications&version=34.1.31
Syncfusion® ASP.NET MVC Notifications Components
A comprehensive suite of ASP.NET MVC notification and feedback components for delivering user notifications and status updates. Includes Toast, Message, and Skeleton components.
Supported Components
This package includes the following components:
ASP.NET MVC Toast Component
The ASP.NET MVC Toast Component provides non-blocking notification pop-ups that appear temporarily to inform users of events, actions, or status changes.
Key Features:
- Predefined Types: Built-in Info, Success, Warning, and Error toast variants via
ToastUtility - Positioning: Configurable X/Y position on screen (e.g., Top Right, Bottom Center)
- Progress Bar: Visual countdown bar with
showProgressBarandprogressDirection(Ltr/Rtl) - Auto Dismiss: Configurable
timeOutandextendedTimeoutfor automatic close - Close Button: Optional
showCloseButtonto allow manual dismissal - Newest on Top: Stack new toasts above existing ones using
newestOnTop - Custom Template: Render any HTML content inside the toast via
template - Action Buttons: Add interactive action buttons directly inside the toast
- Show/Hide API: Programmatically control toasts via
.show()and.hide()methods - CSS Class Types: Apply
e-toast-info,e-toast-success,e-toast-warning,e-toast-dangerstyles
Documentation
ASP.NET MVC Message Component
The ASP.NET MVC Message Component displays inline contextual alert messages with distinct severity levels to communicate status or guidance to the user.
Key Features:
- Severity Levels: Normal, Success, Info, Warning, and Error — each with distinct icon and colour
- Variants: Three display variants — Text, Outlined, and Filled — via the
variantproperty - Show Icon: Toggle the severity icon visibility with
showIcon - Visibility Control: Show or hide the message programmatically via the
visibleproperty - Close Button: Allow users to dismiss the message with
showCloseIcon - Custom Template: Render rich HTML content inside the message body
- Accessible: Built-in ARIA roles and keyboard accessibility
Documentation
ASP.NET MVC Skeleton Component
The ASP.NET MVC Skeleton Component renders animated placeholder shapes that simulate page layout while actual content is loading, improving perceived performance.
Key Features:
- Shapes: Supports Circle, Square, Text, and Rectangle placeholder shapes
- Shimmer Effects: Three built-in animation effects — Wave, Fade, and Pulse
- Configurable Size: Set
widthandheightper skeleton element - Composable: Combine multiple skeleton shapes to mirror complex UI layouts
- Accessible: Communicates loading state to screen readers via ARIA attributes
- Theme Support: Adapts automatically to Fluent, Bootstrap, Material, and other themes
Documentation
Common Setup
These setup steps are required only once for your application, regardless of which Syncfusion components you use.
1. Install Base NuGet Package
Install-Package Syncfusion.AspNetMvc.Notifications
2. Add Namespace Reference
Edit Web.config under the Views folder and add the Syncfusion.EJ2 namespace:
<namespaces>
<add namespace="Syncfusion.EJ2"/>
</namespaces>
3. Add Stylesheet & Script References
In your layout file (~/Views/Shared/_Layout.cshtml), add the following in the <head> section:
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewBag.Title - Syncfusion Application</title>
<link rel="stylesheet" href="https://cdn.syncfusion.com/ej2/34.1.31/fluent2.css" />
<script src="https://cdn.syncfusion.com/ej2/34.1.31/dist/ej2.min.js"></script>
</head>
4. Register Script Manager
At the end of the <body> tag in your layout file (~/Views/Shared/_Layout.cshtml):
<body>
@RenderBody()
@Html.EJS().ScriptManager()
</body>
Quick Start
Step 1: Add ASP.NET MVC Notifications controls
Add the Syncfusion® ASP.NET MVC Notifications controls ~/Views/Home/Index.cshtml page:
@Html.EJS().Message("message")
.Content("This is an informational message")
.Severity(Syncfusion.EJ2.Notifications.MessageSeverity.Info)
.ShowCloseIcon(true)
.Render()
@Html.EJS().Toast("element").Title("Matt sent you a friend request").Content("You have a new friend request yet to accept").Render()
<script type="text/javascript">
setTimeout(() => {
var toastObj = document.getElementById('element').ej2_instances[0];
toastObj.target = document.body;
toastObj.show();
}, 1000);
</script>
@Html.EJS().Skeleton("skeletonCircleSmall").Shape(SkeletonType.Circle).Width("3rem").Render()
@Html.EJS().Skeleton("skeletonCircleMedium").Shape(SkeletonType.Circle).Width("48px").Render()
Step 2: Create controller ~/Controllers/HomeController.cs
using Syncfusion.EJ2.Buttons;
public class HomeController : Controller
{
public ActionResult Index()
{
List<SpeedDialItem> items = new List<SpeedDialItem>
{
new SpeedDialItem { IconCss = "e-icons e-cut", Text = "Cut" },
new SpeedDialItem { IconCss = "e-icons e-copy", Text = "Copy" },
new SpeedDialItem { IconCss = "e-icons e-paste", Text = "Paste" }
};
ViewBag.DataSource = items;
return View();
}
}
Step 3: Run the Application
Press Ctrl+F5 to run the application in your browser.
Support
License
This is a commercial product and requires a paid license for possession or use. Review the Syncfusion® EULA.
About Syncfusion®
Syncfusion® provides 1600+ UI components and frameworks for web, mobile, and desktop development across multiple platforms:
Web: Blazor | ASP.NET MVC | ASP.NET MVC | JavaScript | Angular | React | Vue
Desktop: WinForms | WPF | WinUI
Learn more at www.syncfusion.com
sales@syncfusion.com | Toll Free: 1-888-9-DOTNET
| Product | Versions Compatible and additional computed target framework versions. |
|---|---|
| .NET Framework | net462 is compatible. net463 was computed. net47 was computed. net471 was computed. net472 was computed. net48 was computed. net481 was computed. |
-
- Newtonsoft.Json (>= 13.0.3)
- Syncfusion.AspNetMvc.Base (>= 34.1.31)
- Syncfusion.EJ2.JavaScript (>= 34.1.31)
- Syncfusion.Licensing (>= 34.1.31)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.