javascript validation is not working properly

Question

Only one condition are exeuted other is not. Please provide the solution.

function a() {
    var x=document.forms["addform"]["gender"].value;
    if (x==null || x==""){
        alert("Enter gender");
        return false;
    }

    var y=document.forms["addform"]["count"].value;
    if (y==null || y==""){
        alert("enter country");
        return false;
    }
}

Adding some more code and being a bit more polite does go a long way of earning that answer! :) — Henrik Andersson, Dec 04 '12 at 07:44

score 2 · Answer 1 · edited May 23 '17 at 11:48

2

The reason both alerts are not firing (if your elements are referenced correctly) is because you are executing return false; in each if. This prevents any more code from firing in the function, and so the second if does not have a chance to fire.

In my code, I have added a variable and then I return false; at the end of the function if either if executes. This allows both alerts to fire.

function a()
{
  var submitform = true, x=document.forms["addform"]["gender"].value, y=document.forms["addform"]["count"].value;
  if (x===null || x=="") {
    alert("Enter gender");
    submitform = false;
  }   

  if (y===null || y=="") {
    alert("enter country");
    submitform = false;
  }
  // Added an if here
  if (submitform === false) {
    return false;
  }
}

Thanks
Frederick

edit: using === is a better practice for checking for identical values. See this stackoverflow question for more.

edited May 23 '17 at 11:48

Community

1
1

answered Dec 04 '12 at 07:53

Fred

4,195
2
29
42

Thank you! At sixteen, I am trying to practice explaining myself to others, as it will help me with university, and also high school, as it will help me understand topics and ideas more if I can explain them to my friends and people on this site. – Fred Dec 04 '12 at 08:13
@Fred Great mindset to have, to explain further is that you can have as many "return" values as you want in a function but its important to note that the function will exclude the rest of the function once it hits its first "return". Consider return a final statement of your function no matter where it is located. – Kodemon Dec 04 '12 at 08:28

score 0 · Answer 2 · answered Dec 04 '12 at 07:52

One condition works and the other doesn't, that means you probably have the element name wrong for the one that isn't working. gender and count should be the name of the input or select elements. So your HTML should look similar to this if you're using selects:

<select name="gender">  <--- name = gender
    <option value="">Please select</option>
    <option value="M">Male</option>
    <option value="F">Female</option>
</select>

<select name="count">   <--- name = count
    <option value="">Please select</option>
    <option value="USA">USA</option>
    <option value="Canada">Canada</option>
</select>

Showing all of the errors in one alert would be nicer:

function a()
{
    var errors = "";

    var x=document.forms["addform"]["gender"].value;
    if (x==null || x==""){
        errors += "Enter gender" + "\n";
    }

    var y=document.forms["addform"]["count"].value;
    if (y==null || y==""){
        errors += "Enter Country" + "\n";
    }

    if(errors)
    {
        alert(errors);
        return false;
    }
}

javascript validation is not working properly

2 Answers2