toastr use partial page in .net core

Edited

Implement in partial page 

user of this question

codersk700@gmail.com

Asked 2/5/2024 7:02:10 PM

1 Answers

unliked

1

To use Toastr in a partial page in .NET Core, you can follow these general steps:

Install Toastr: Ensure that you have installed Toastr in your project. You can install Toastr via npm or use a CDN link in your HTML.

Include Toastr Files: Include the necessary Toastr CSS and JavaScript files in your partial page or layout file where you want to display the toastr notifications.

Initialize Toastr: Initialize Toastr in your JavaScript file or script section in your partial page. You can customize the toastr options according to your requirements.

Trigger Toastr Notifications: Trigger Toastr notifications from your server-side code (e.g., in your controller actions or Razor Pages) by passing the necessary data to the partial page where Toastr is initialized.

Here's a basic example of how you can achieve this:

In your partial view or layout file (e.g., _PartialView.cshtml):

<!DOCTYPE html>
<html>
<head>
    <!-- Include Toastr CSS -->
    <link href="path/to/toastr.css" rel="stylesheet" />
</head>
<body>
    <!-- Your HTML content here -->

    <!-- Include Toastr JavaScript -->
    <script src="path/to/toastr.js"></script>

    <!-- Toastr initialization -->
    <script>
        // Initialize Toastr
        toastr.options = {
            "closeButton": true,
            "positionClass": "toast-top-right",
            "showDuration": "300",
            "hideDuration": "1000",
            "timeOut": "5000",
            "extendedTimeOut": "1000"
        };
    </script>
</body>
</html>

In your controller action or Razor Page handler:

public IActionResult MyAction()
{
    // Your server-side logic

    // Trigger Toastr notification
    TempData["toastrMessage"] = "This is a toastr message.";

    return PartialView("_PartialView");
}

In your partial view, handle the Toastr notification using TempData:

@{
    var toastrMessage = TempData["toastrMessage"] as string;
    if (!string.IsNullOrEmpty(toastrMessage))
    {
        <script>
            toastr.success('@toastrMessage');
        </script>
    }
}

This setup allows you to trigger Toastr notifications from your server-side code and display them in your partial views or layout files in ASP.NET Core. Adjust the paths and options according to your project's structure and requirements.

Edited

user of this answer

ranjanrjcode01.com@gmail.com

Answered 2/5/2024 7:09:14 PM

Add Your Answer


Add New