Syncfusion.AspNetMvc.Popups
34.1.31
Prefix Reserved
dotnet add package Syncfusion.AspNetMvc.Popups --version 34.1.31
NuGet\Install-Package Syncfusion.AspNetMvc.Popups -Version 34.1.31
<PackageReference Include="Syncfusion.AspNetMvc.Popups" Version="34.1.31" />
<PackageVersion Include="Syncfusion.AspNetMvc.Popups" Version="34.1.31" />
<PackageReference Include="Syncfusion.AspNetMvc.Popups" />
paket add Syncfusion.AspNetMvc.Popups --version 34.1.31
#r "nuget: Syncfusion.AspNetMvc.Popups, 34.1.31"
#:package Syncfusion.AspNetMvc.Popups@34.1.31
#addin nuget:?package=Syncfusion.AspNetMvc.Popups&version=34.1.31
#tool nuget:?package=Syncfusion.AspNetMvc.Popups&version=34.1.31
Syncfusion® ASP.NET MVC Popups Components
A comprehensive suite of ASP.NET MVC popup and overlay components for building modal and modeless dialogs, tooltips, and loading states. Includes Dialog, Tooltip, and Spinner components.
Supported Components
This package includes the following components:
ASP.NET MVC Dialog Component
The ASP.NET MVC Dialog Component provides modal and modeless dialog windows for displaying content, confirmations, and user input overlays.
Key Features:
- Modal & Modeless: Supports both blocking modal and non-blocking modeless display modes
- Predefined Dialogs: Built-in utility functions for Alert, Confirm, and Prompt dialogs
- Header & Footer: Configurable header title, close icon, and action button footer
- Drag & Resize: Enable users to reposition and resize the dialog interactively
- Content Template: Render any HTML content or Razor partial inside the dialog body
- Animation: Configurable open/close animation effects
- Overlay: Customizable backdrop overlay with
overlayClickevent support - Close on Escape: Optionally close the dialog by pressing the Escape key
- Positioning: Set dialog position relative to the viewport or a specific target element
Documentation
ASP.NET MVC Tooltip Component
The ASP.NET MVC Tooltip Component displays informational pop-ups when users hover, click, focus, or touch a target element.
Key Features:
- 12 Positions: Display tooltip in 12 different positions relative to the target
- Open Modes: Supports Hover, Click, Focus, and Custom trigger modes
- Rich Content: Content can be plain text, HTML, images, hyperlinks, or custom templates
- Dynamic Content: Load tooltip content dynamically via Fetch/AJAX in
beforeRenderevent - Multiple Targets: Attach a single tooltip to multiple targets within a container using CSS selectors
- Animation: Configurable show/hide animation effects
- Sticky Mode: Keep tooltip open until the user manually closes it via a close icon
- Mouse Trail: Move tooltip along with the mouse pointer
- Open/Close Delay: Configurable
openDelayandcloseDelayin milliseconds - Auto Tip Position: Automatically repositions the tip pointer to stay within the viewport
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.Popups
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 Buttons control
Add the Syncfusion® ASP.NET MVC Buttons control ~/Views/Home/Index.cshtml page:
<div style='display: inline-flex; position: relative; left: 50%; transform: translateX(-50%); margin-top: 100px;'>
@Html.EJS().Tooltip("Tooltip")
.Content("Lets go green & Save Earth !!!")
.Position(Syncfusion.EJ2.Popups.Position.TopCenter)
.ContentTemplate(@<span id='target'>
Show Tooltip
</span>)
.Render()
</div>
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.