Notification texts go here Contact Us Buy Now!

How to get alert to display properly based on number of inputs?

Technical Resolution: Alert Customization Based on Input

In the realm of web development, crafting engaging user experiences is paramount. One crucial aspect is ensuring that alerts and notifications are displayed appropriately based on user input. This technical blog post delves into the intricacies of this process, addressing two critical issues in the provided logic.

Addressing Logical Errors

  1. Logical Operator Mistake:
    The condition if (keepRunning = false) contains an incorrect logical operator. The assignment operator = should be replaced with a comparison operator such as == or ===. Failure to do so can lead to unexpected behavior.
  2. Variable Scope Error:
    Outside the for loop, the variable i is inaccessible. To rectify this, utilize colorNames.length in the if conditions instead. This ensures that the code operates as intended.

Working Example:


      // Variable for while loop
      var colorNames = [];
      var keepRunning = true;

      // Keep naming colors until done
      while (keepRunning === true) {
        var newColor = prompt('Name as many colors as you can!' + "\n" + 'If you can\'t think of any more, leave empty and hit OK.');

        // Test if prompt box has something in it or not
        if (newColor.length > 0) {
          colorNames.push(newColor);
        } else {
          keepRunning = false;
        }
      }

      // Display color names entered 
      for (var i = 0; i < colorNames.length; i++) {
        var cName = colorNames[i];
        document.write(cName + "  ");
      }

      // Alert pop up based on number of inputs
      if (keepRunning === false) {
        if (colorNames.length <= 4) {
          alert('That\'s all you could think of? Refresh and try again!')
        } else if (colorNames.length <= 8) {
          alert('Not bad, but you can probably do better. Refresh to play again.')
        } else if (colorNames.length <= 12) {
          alert('Wow! You really know your colors! You can refresh to challenge yourself again!')
        } else if (colorNames.length >= 15) {
          alert('I don\'t think anyone could do better than this, nice job!')
        }
      }
    

In conclusion, attention to detail and a solid understanding of logical operators and variable scope are essential for creating flawless web applications. This blog post serves as a valuable resource for developers seeking to enhance their skills in managing user input and displaying appropriate feedback.

Post a Comment

Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.