如何确定输入元素的值是否为空（空）

Question

I have following code to check if the inputs with the ids emailForm and nameForm are blank, this however isn't working when I test the form by leaving it blank.

 function setInfo() {
    if (document.getElementById("emailForm").value == null || 
    document.getElementById("nameForm").value == null) {

        alert("Please Fill in all sections");

    } else {

    email = document.getElementById("emailForm").value;
    name = document.getElementById("nameForm").value;
    loaded();

    }
}

Could someone help me with this, thanks!

Answer 1

Instead of checking for null specifically, you should check for falsy values. In some cases, the values for empty textboxes will be an empty string.

Replace this:

if (document.getElementById("emailForm").value == null || document.getElementById("nameForm").value == null) {

with this:

if (!document.getElementById("emailForm").value || !document.getElementById("nameForm").value) {

Answer 2

You shouldn't be checking whether the fields are null , you should be checking whether they content is an empty string (with .value == '' ).

This can be seen working in the following:

 function setInfo() { if (document.getElementById("emailForm").value == '' || document.getElementById("nameForm").value == '') { console.log("Please fill in all sections"); } else { email = document.getElementById("emailForm").value; name = document.getElementById("nameForm").value; //loaded(); console.log("All sections filled in"); } } const button = document.getElementById('go'); button.addEventListener('click', function() { setInfo(); }); 

 <input id="emailForm" /> <input id="nameForm" /> <button id="go">Go</button> 

Answer 3

Make sure you calling function setInfo()

function setInfo() {

    // You can check Value.Length also or 
    if (document.getElementById("emailForm").value === "" ||
        document.getElementById("nameForm").value === "") {

        alert("Please Fill in all sections");

    } else {

        email = document.getElementById("emailForm").value;
        name = document.getElementById("nameForm").value;

        loaded();
    }
}

Answer 4

Try below solution:

function setInfo() {

var email=document.getElementById("emailForm").value;
var name=document.getElementById("nameForm").value;

if (email=='' || email==null || name=='' || name== null ) { // OR if (!email || !name)

    alert("Please Fill in all sections");
    return;

  } else {
     loaded();
   }
}

Answer 5

You should check whether the string is empty or not instead of null. Try using the code below:

function setInfo() {


var a=document.getElementById("emailForm").value;
var b=document.getElementById("nameForm").value;
if (a == "" || 
b == "") {

alert("Please Fill in all sections");

} else {

email = 
document.getElementById("emailForm").value;
name = 
document.getElementById("nameForm").value;
alert("success alert");

}
}