Carlos
Carlos

Reputation: 472

Why my message is not displayed when the function called in Javascript?

I have set the message to display and fadeOut after 5 seconds and it worked for the first function called but after then the message just disappeared and nothing showed up. This is my first time using jquery so don't mind me.

here is function

         error: function (response) {
            var errorResult = response["responseJSON"]["error"];
            // if error occurs remove success text if have
            $("#suc-text").html("");

            for (var key in errorResult) {
              if (errorResult.hasOwnProperty(key)) {
                // check the key
                if (String(key) == "username") {
                  $("#err-text-username").html(errorResult[key][0]).delay(5000).fadeOut(); <-not display
                  console.log("username error")
              }
            }
          },

The var errorResult = response["responseJSON"]["error"] returns something like this:

{"username": ["username is already existed"], .....}

and I want to get only the message username is already existed so I loop through the object and get the message by doing this errorResult[key][0] and it works just fine for the first function called but then it's not showing up.

after each called I can see username error was printed out in console except the message's not displaying.

Upvotes: 0

Views: 45

Answers (1)

Jaromanda X
Jaromanda X

Reputation: 1

The reason this

$("#err-text-username").html(errorResult[key][0]).delay(5000).fadeOut();

Only works the first time, is that after 5 seconds $("#err-text-username") is made invisible

To subsequently display again the easiest way (and nice fading) is

$("#err-text-username").html(errorResult[key][0]).fadeIn().delay(5000).fadeOut();

Upvotes: 1

Related Questions