Making Validation System - by showing valid label depending on a msg.payload value coming from Database when it is true and showing an error label when the msg.payload is false

I'm new to node-red, I'm working on a project where the user types a value in UI_Template node and the value is passed to mongodb3 node to check if it exists in the database then send a msg.payload that comes to a page(UI_Template node), that should have a valid message(for example: green label with valid text) if the msg is true and an error message (for example: red label with error text) if the msg is false.

The page also is expected to hide the message (either valid or error) after 5 seconds, and be ready to receive another instance of this msg.payload from the database as the user enters a new value.

The code I developed only work on the first instance of the user's input, And the page should receive this variable countless times and show if it is valid or error.

Here is the code I wrote in the second UI page:

<head>
  <style>
    .button1 {background-color: #4CAF50;} /* Green */
    .button2 {background-color: #f44336;} /* Red */
    .button3 {background-color: #ffffff;}   /* white */
  </style>
</head>
<body> 
    <span id="lbl2"  ng-class="{button1:msg.payload== true, button2:msg.payload== false}">validation message! 
    <script>setTimeout(function({document.getElementById("lbl2").style.backgroundColor="#ffffff";
              document.getElementById("b").innerHTML = "";},5000)</script>
    </span> 
</body>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.