0

I would like a message to be shown to the user, if an email address is entered incorrectly.

Html

<p>Email: <input type="email" id="email" onblur="validateEmail()" 
required>

<p id="emailMessage"></p>

Javascript

function validateEmail(email){
    var regEx = /\S+@\S+/;
    var result = regEX.test(email);

    if (result = true)
        document.getElementById("emailMessage").innerhtml = ""
    else (result = false)
        document.getElementById("emailMessage").innerhtml = "Please enter a valid 
email address"
}
JIST
  • 1,139
  • 2
  • 8
  • 30
  • 3
    Possible duplicate of [How to validate an email address in JavaScript?](https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript) – frobinsonj Jul 25 '18 at 12:44
  • try if (result). What you are doing is making result equal to true . – Faizan Fayaz Jul 25 '18 at 12:44

3 Answers3

0

There are many issues in your approach. Because you seems to be new to this, I will tell you what is wrong step-by-step:

  • result = true and result = false will set the value of result to a boolean. A condition has to be == or ===. Or in your case, just use the result variable, what is already an boolean because of the result of .test().
  • Use innerHTML instead of innerhtml.
  • It's not allowed to break a string in javascript like this.
  • Your variable is called regEx not regEX.
  • email is not a parameter of the function by default, you need to pass this to the function to have it available.
  • You need to check on email.value, nut just email, beacuse this is just the element.
  • else can't have a condition to check, if you want to you need to use else if, but that is not needed here.

function validateEmail(email) {
  var regEx = /\S+@\S+/;
  var result = regEx.test(email.value);

  if (result) {
    document.getElementById("emailMessage").innerHTML = "";
  }
  else {
    document.getElementById("emailMessage").innerHTML = "Please enter a valid email address";
  }
}
<p>Email:</p>
<input type="email" id="email" onblur="validateEmail(this)" required>
<p id="emailMessage"></p>
eisbehr
  • 12,243
  • 7
  • 38
  • 63
-2
//correct code
  function validateEmail(email)
     {
      var regEx = /\S+@\S+/;
      var result = regEX.test(email);
      if (result == true)
          document.getElementById("emailMessage").innerHTML = ""
      else (result == false)
          document.getElementById("emailMessage").innerHTML = "Please enter a valid email address"
}
Roshana Pitigala
  • 8,437
  • 8
  • 49
  • 80
  • While this may answer the question it's better to add some description on how this answer may help to solve the issue. Please read [_How do I write a good answer_](https://stackoverflow.com/help/how-to-answer) to know more. – Roshana Pitigala Jul 25 '18 at 15:05
-3
document.getElementById("emailMessage").innerHTML = "Please enter a valid 
email address"

//use innerHTML not innerhtml, that is the problem

JNI_OnLoad
  • 5,472
  • 4
  • 35
  • 60
  • There are even more issues in his code. Not even this. This answer is just not helpful ... – eisbehr Jul 25 '18 at 12:52
  • No, you didn't. You posted a new answer. And the new answer is still completely invalid. – eisbehr Jul 25 '18 at 13:05
  • Please test you code by yourself and see if it will work. Spoiler: it woun't. – eisbehr Jul 25 '18 at 13:10
  • Do you even know what _spoiler_ means, in this context? ;) It mean some kind of a hint, nothing rude here. And in your context, it would mean that I am a _spoiler_, not you. ;) And it has nothing to do with the fact, if I posted the question or not. Your both answers are simply incorrect will not work in any way. If you would put more effort in your answers you will probably see it by yourself. I'm not sure why your would rather _ignore_ me, because I'm not the creator, instead of fixing your answers ... I'm out now, your choice. – eisbehr Jul 25 '18 at 13:20