locked
Toastr messages are not showing for controllers why not ! RRS feed

  • Question

  • User-183185495 posted

    I am trying to use tost notifications using the following libary in 3.1 but its not working as expected.

    https://github.com/nabinked/NToastNotify

    My css so you can see the styles I use as follows.

      <!-- Toastr -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css">
    
        <!-- Font Awesome -->
        <link rel="stylesheet" href="/font-awesome/css/all.css">
    
        <link rel="stylesheet" href="/font-awesome/css/brands.css">
    
        <link rel="stylesheet" href="/font-awesome/css/fontawesome.css">
    
        <link rel="stylesheet" href="//unpkg.com/bootstrap-select@1.12.4/dist/css/bootstrap-select.min.css" type="text/css" />
        <link rel="stylesheet" href="//unpkg.com/bootstrap-select-country@4.0.0/dist/css/bootstrap-select-country.min.css" type="text/css" />
    
        <link rel="stylesheet" href="/css/site.css">
        <!-- Ionicons -->
        <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
    
        <!-- DataTables -->
    
        <link href="https://cdn.datatables.net/1.10.15/css/dataTables.bootstrap.min.css" rel="stylesheet" />
        <link href="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css" rel="stylesheet" />
    
    
        <!-- Theme style -->
        <!-- Ionicons -->
        <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
        <!-- overlayScrollbars -->
        <link rel="stylesheet" href="/dist/css/adminlte.min.css">
        <!-- Google Font: Source Sans Pro -->
        <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
        <!-- iCheck for checkboxes and radio inputs -->
        <link rel="stylesheet" href="/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
    
    
        <link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
    
        <link rel="stylesheet" href="https://rawcdn.githack.com/dmhendricks/file-icon-vectors/master/dist/file-icon-vectors.min.css" />
    
        <link rel="stylesheet" href="/plugins/select2/css/select2.css">
        <link rel="stylesheet" href="/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
        <link rel="stylesheet" href="/flag-icon-css/css/flag-icon.css">

    My Javascript

        <!-- ./wrapper -->
        <!-- jQuery -->
        <script type="text/javascript" src="/lib/jquery/dist/jquery.js"></script>
        <!-- Bootstrap 4 -->
        <script src="/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
        <!-- AdminLTE App -->
        <script src="/dist/js/adminlte.min.js"></script>
        <!-- AdminLTE for demo purposes -->
    
        <script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap4.min.js "></script>
    
        <script src="/plugins/jquery-validation/jquery.validate.js" type="text/javascript"></script>
        <script src="/plugins/jquery-validation/additional-methods.min.js"></script>
        <script src="/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js" type="text/javascript"></script>
    
        
        <!-- bootstrap color picker -->
          <!-- Bootstrap Switch -->
        <script src="/plugins/bootstrap-switch/js/bootstrap-switch.min.js"></script>
        <script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
    
    
        <script src="/font-awesome/js/all.js"></script>
        <script src="/font-awesome/js/brands.js"></script>
        <script src="/font-awesome/js/fontawesome.js"></script>
        <script src="/plugins/select2/js/select2.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
        @RenderSection("Scripts", required: false)
    

    I am setting it up as follows in startup.cs

                services.AddMvc().AddNToastNotifyToastr(new ToastrOptions() {
                    ProgressBar = false,
                    PositionClass = ToastPositions.TopRight,
                    ToastClass = "alert",
    
                });
    
                app.UseCookiePolicy();
                    
                app.UseNToastNotify();
               
                app.UseSession();
            app.UseHttpsRedirection();
            app.UseStaticFiles();
            app.UseRouting();
            app.UseAuthentication();
            app.UseAuthorization();

    In My Controller I am injecting it as such.

     private readonly IToastNotification _toast;
    
            private readonly UserManager<ApplicationUser> _userManager;
            public int CaseId { get; set; }
            public MISObjectsController(MISDBContext context, IStringLocalizer<MISObjectsController> localizer,
                       IStringLocalizer<SharedResource> sharedLocalizer, UserManager<ApplicationUser> userManager, IToastNotification toast) {
    
    
                _context = context;
    
                _sharedLocalizer = sharedLocalizer;
                _userManager = userManager;
                var list = _userManager.Users.Select(x => new SelectListItem() { Text = x.FirstName.ToUpperInvariant() + " " + x.LastName.ToUpperInvariant(), Value = x.Id.ToString() }).ToListAsync();
                ViewBag.Users = list;
                _toast = toast;
                _toast.AddSuccessToastMessage("Test");
    
            }

    The applying it as such in my method 

    But its not showing the message even though its hitting the brake point of it and getting past it without error to the redirect.

           [HttpPost]
            public async Task<IActionResult> AddToAuditTrail(string updateInfo) {
    
                var userId = GetCurrentTennantId().Result;
                var caseOfficer = _context.Users.Where(w => w.Id == userId.ToString()).FirstOrDefault();
                Int32.TryParse(TempData.Peek("CaseId").ToString(), out int resultCaseId);
                MISAuditTrail _auditrail = new MISAuditTrail();
                _auditrail.MISObjectId = resultCaseId;
                _auditrail.TennantId = userId;
                _auditrail.CreatedBy = caseOfficer.FirstName + caseOfficer.LastName.Substring(0, 1);
                _auditrail.Action = updateInfo;
                _auditrail.AuditType = (int)MISAuditTrail.AudItTypes.NOTES;
                _auditrail.CreatedDate = DateTime.Now;
                _auditrail.isActive = true;
                _auditrail.isDeleted = false;
    
                _context.Add(_auditrail);
                await _context.SaveChangesAsync();
                _toast.AddSuccessToastMessage("You have added an update to the case");
    
                return RedirectToAction("Edit", new { id = resultCaseId });
    
            }

    Edge console to prove no errors.

    Thursday, August 6, 2020 12:47 AM

Answers

  • User-183185495 posted

    When I rolled back my page i forgot to re add the following to the body

    @await Component.InvokeAsync("NToastNotify")

    Leaving this here for anyone else this should be added to the layout file 

    I am trying to use tost notifications using the following libary in 3.1 but its not working as expected.

    https://github.com/nabinked/NToastNotify

    My css so you can see the styles I use as follows.

      <!-- Toastr -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css">
    
        <!-- Font Awesome -->
        <link rel="stylesheet" href="/font-awesome/css/all.css">
    
        <link rel="stylesheet" href="/font-awesome/css/brands.css">
    
        <link rel="stylesheet" href="/font-awesome/css/fontawesome.css">
    
        <link rel="stylesheet" href="//unpkg.com/bootstrap-select@1.12.4/dist/css/bootstrap-select.min.css" type="text/css" />
        <link rel="stylesheet" href="//unpkg.com/bootstrap-select-country@4.0.0/dist/css/bootstrap-select-country.min.css" type="text/css" />
    
        <link rel="stylesheet" href="/css/site.css">
        <!-- Ionicons -->
        <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
    
        <!-- DataTables -->
    
        <link href="https://cdn.datatables.net/1.10.15/css/dataTables.bootstrap.min.css" rel="stylesheet" />
        <link href="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css" rel="stylesheet" />
    
    
        <!-- Theme style -->
        <!-- Ionicons -->
        <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
        <!-- overlayScrollbars -->
        <link rel="stylesheet" href="/dist/css/adminlte.min.css">
        <!-- Google Font: Source Sans Pro -->
        <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
        <!-- iCheck for checkboxes and radio inputs -->
        <link rel="stylesheet" href="/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
    
    
        <link href="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/css/bootstrap4-toggle.min.css" rel="stylesheet">
    
        <link rel="stylesheet" href="https://rawcdn.githack.com/dmhendricks/file-icon-vectors/master/dist/file-icon-vectors.min.css" />
    
        <link rel="stylesheet" href="/plugins/select2/css/select2.css">
        <link rel="stylesheet" href="/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
        <link rel="stylesheet" href="/flag-icon-css/css/flag-icon.css">

    My Javascript

        <!-- ./wrapper -->
        <!-- jQuery -->
        <script type="text/javascript" src="/lib/jquery/dist/jquery.js"></script>
        <!-- Bootstrap 4 -->
        <script src="/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
        <!-- AdminLTE App -->
        <script src="/dist/js/adminlte.min.js"></script>
        <!-- AdminLTE for demo purposes -->
    
        <script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap4.min.js "></script>
    
        <script src="/plugins/jquery-validation/jquery.validate.js" type="text/javascript"></script>
        <script src="/plugins/jquery-validation/additional-methods.min.js"></script>
        <script src="/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js" type="text/javascript"></script>
    
        
        <!-- bootstrap color picker -->
          <!-- Bootstrap Switch -->
        <script src="/plugins/bootstrap-switch/js/bootstrap-switch.min.js"></script>
        <script src="https://cdn.jsdelivr.net/gh/gitbrent/bootstrap4-toggle@3.6.1/js/bootstrap4-toggle.min.js"></script>
    
    
        <script src="/font-awesome/js/all.js"></script>
        <script src="/font-awesome/js/brands.js"></script>
        <script src="/font-awesome/js/fontawesome.js"></script>
        <script src="/plugins/select2/js/select2.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
        @RenderSection("Scripts", required: false)

    I am setting it up as follows in startup.cs

                services.AddMvc().AddNToastNotifyToastr(new ToastrOptions() {
                    ProgressBar = false,
                    PositionClass = ToastPositions.TopRight,
                    ToastClass = "alert",
    
                });
    
                app.UseCookiePolicy();
                    
                app.UseNToastNotify();
               
                app.UseSession();
            app.UseHttpsRedirection();
            app.UseStaticFiles();
            app.UseRouting();
            app.UseAuthentication();
            app.UseAuthorization();

    In My Controller I am injecting it as such.

     private readonly IToastNotification _toast;
    
            private readonly UserManager<ApplicationUser> _userManager;
            public int CaseId { get; set; }
            public MISObjectsController(MISDBContext context, IStringLocalizer<MISObjectsController> localizer,
                       IStringLocalizer<SharedResource> sharedLocalizer, UserManager<ApplicationUser> userManager, IToastNotification toast) {
    
    
                _context = context;
    
                _sharedLocalizer = sharedLocalizer;
                _userManager = userManager;
                var list = _userManager.Users.Select(x => new SelectListItem() { Text = x.FirstName.ToUpperInvariant() + " " + x.LastName.ToUpperInvariant(), Value = x.Id.ToString() }).ToListAsync();
                ViewBag.Users = list;
                _toast = toast;
                _toast.AddSuccessToastMessage("Test");
    
            }

    The applying it as such in my method 

    But its not showing the message even though its hitting the brake point of it and getting past it without error to the redirect.

           [HttpPost]
            public async Task<IActionResult> AddToAuditTrail(string updateInfo) {
    
                var userId = GetCurrentTennantId().Result;
                var caseOfficer = _context.Users.Where(w => w.Id == userId.ToString()).FirstOrDefault();
                Int32.TryParse(TempData.Peek("CaseId").ToString(), out int resultCaseId);
                MISAuditTrail _auditrail = new MISAuditTrail();
                _auditrail.MISObjectId = resultCaseId;
                _auditrail.TennantId = userId;
                _auditrail.CreatedBy = caseOfficer.FirstName + caseOfficer.LastName.Substring(0, 1);
                _auditrail.Action = updateInfo;
                _auditrail.AuditType = (int)MISAuditTrail.AudItTypes.NOTES;
                _auditrail.CreatedDate = DateTime.Now;
                _auditrail.isActive = true;
                _auditrail.isDeleted = false;
    
                _context.Add(_auditrail);
                await _context.SaveChangesAsync();
                _toast.AddSuccessToastMessage("You have added an update to the case");
    
                return RedirectToAction("Edit", new { id = resultCaseId });
    
            }

    Edge console to prove no errors.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, August 6, 2020 12:56 AM