Show toaster notification only when login is successfull

Question

I want to show a Toast notification in my Asp.Net website when a user clicks the Login button after providing the user name and password. If the login is successfull, a welcome toast notification should appear. Right now I have following code in my master sheet.

  $(document).ready(function () {
            setTimeout(function () {
                toastr.options = {
                    closeButton: true,
                    progressBar: true,
                    showMethod: 'slideDown',
                    timeOut: 4000
                };
                toastr.success('Welcome here', 'Welcome to SPSL');

            }, 1300);
        });

But the problem is this appears every time I navigate to a different page (Since this is in the master sheet). How do I get this to be shown only once when the user successfully logs into the system?

How about sending some query string when navigating to default page after successful login? Parse it in clientside and only show notification then? Does that help? — Sachin Nambiar Nalavattanon, Aug 15 '15 at 05:05
Im sure it will, can u plz give some code example on how to achieve this? — WAQ, Aug 15 '15 at 05:14

score 0 · Accepted Answer · edited May 23 '17 at 12:06

So I am assuming there will be some landing page which will be redirected after a successful login. Eg from login.aspx to default.aspx

So make it default.aspx?firsttime=yes

In this way, only for the first time when you hit default.aspx you will have that extra query string.

Instead of placing your code in master page, you can put that in default.aspx and check for the query string.

eg:

function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split('=');
        if (decodeURIComponent(pair[0]) == variable) {
            return decodeURIComponent(pair[1]);
        }
    }
    return "notfound";
    console.log('Query variable %s not found', variable);

}

Taken from: Parse query string in JavaScript

Now your code in default.aspx can be,

 $(document).ready(function() {
     if (getQueryVariable("firsttime") === "yes") {
         setTimeout(function() {
             toastr.options = {
                 closeButton: true,
                 progressBar: true,
                 showMethod: 'slideDown',
                 timeOut: 4000
             };
             toastr.success('Welcome here', 'Welcome to SPSL');

         }, 1300);
     }
 });

Show toaster notification only when login is successfull

1 Answers1