HTML/JS code to display Error Message if Input is Wrong

Question

I am trying to write an HTML5 - JS Program that displays an Error Message IF the User Input is Empty. But I am not able to get the "Error Message", even thou I can't seem to find any issues.

I am a complete beginner and the Video Tutorial I am using doesn't have any User Support.

Please Help.

I have tried all I know but no avail.

<!DOCTYPE html>
<html>
<head>
    <title>Error Message Display</title>
    <script type="text/javascript">
        function displayInput()
        {
            var testInput = document.getElementById("name").value;
            if (testInput.lenght == 0)
        {
            document.getElementById("para").innerHTML = "NOOOO";
        }else
            document.getElementById("para").innerHTML = testInput;
       }
   </script>
</head>
<body>
    <input id="name" type="text"/>
    <button onclick="displayInput();">Show The Text</button>
    <p6 id="para"></p6>
</body>
</html>

If the Input is Empty an Error Message i.e NOOOO should display.

Thank You for teaching me. I will focus on that part from now on. — CodingNoob
– CodingNoob, Commented Aug 2, 2019 at 8:50

Rishab · Accepted Answer · 2019-08-02 08:51:30Z

1

hi you made spelling mistake in length property of element

it should not be lenght

function displayInput()
{
  let el = document.getElementById("name");
  let para = document.getElementById("para")
  var testInput = el.value;
  if (testInput.length == 0)
  {
    para.innerHTML = "NOOOO";
  }
  else{   

    para.innerHTML = testInput;
  }
}

<!DOCTYPE html>
<html>
<head>
    <title>Error Message Display</title>
</head>
<body>

<input id="name" type="text"/>

<button onclick="displayInput();">Show The Text</button>

<p6 id="para"></p6>

edited Aug 2, 2019 at 8:51

answered Aug 2, 2019 at 8:46

Rishab

1,5322 gold badges14 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

CodingNoob Over a year ago

Thank You for teaching me. I will keep that in mind in the future.

Rishab Over a year ago

Hi @CodingNoob I have also updated your code, to reduce the memory utilization and loading the element into variables once and reduce code repitation

CodingNoob Over a year ago

Big Help. Thank you. Although I need some more learning to utilize it fully, I am grateful.

Collectives™ on Stack Overflow

HTML/JS code to display Error Message if Input is Wrong

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related