Saturday, February 16, 2019

JavaScript load ordering in Razor Pages

Tinkering with a custom Notifications System inside a Razor Pages app I am working on. There is jQuery to populate a notification and show it -- I'd prefer to keep that in the main Layout (in one place):

function showNotification(notificationText) { cleanNotification(); if (notificationText.trim()) { $('#Notification').text(notificationText); } $('#Notification').addClass('show'); setTimeout(function () { $('#Notification').removeClass('show'); cleanNotification; }, 3000); } 

And, I'd like to - from within the views that use the Layout - show the notification, with a message coming from the .cshtml.cs, like this:

@if (!string.IsNullOrEmpty(Model.notificationMessage)) { <script> showNotification('@Model.notificationMessage'); cleanNotification(); </script> } 

But - if I understand correctly - I'll need to alter the order in which these will load, because the view will load before the JavaScript in the Layout can load. I'd like my app to be able to provide meaningful messages as I test, so I want a centralized way to fire off success/error notifications.

TL;DR ... Want to pass value from .cshtml.cs to global javaScript function, to show value in a div, but if I understand -- the View will load the JavaScript too soon (before the Layout can load the function the view will call).

JavaScript load ordering in Razor Pages Click here
  • Blogger Comment
  • Facebook Comment

0 comments:

Post a Comment

The webdev Team