current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I seem to be really stuck on something. I have a function to check if all the form input fields are equal to null or "" which is all fine but wanted to see if there is another way of doing it by loading all the fields into a javascript array and then doing a for loop along with an if statement to check if any of the fields are empty, unfortunately I can't seem to get this to work and wondering if I've simply just missed something some where. Here is my code:

function checkempty()
{
    fname = document.getElementById("firstname").value;
    lname = document.getElementById("lastname").value;
    fage = document.getElementById("age").value;
    addressl1 = document.getElementById("addressline1").value;
    addressl2 = document.getElementById("addressline2").value;
    ftown = document.getElementById("town").value;
    fcounty = document.getElementById("county").value;
    fpcode1 = document.getElementById("pcode1").value;
    fpcode2 = document.getElementById("pcode2").value;
    ftelephone = document.getElementById("telephone").value;
    fcomment = document.getElementById("comment").value;

    var myArray = [];
    myArray[0] = fname;
    myArray[1] = lname;
    myArray[2] = fage;
    myArray[3] = addressl1;
    myArray[4] = addressl2;
    myArray[5] = ftown;
    myArray[6] = fcounty;
    myArray[7] = fpcode1;
    myArray[8] = fpcode2;
    myArray[9] = ftelephone;
    myArray[10] = fcomment;

    for(i=0;i<myArray.length;i++)
    {
        if(!myArray[0])
        {
            return true;
        }
    }
    return false;
}

I then use another function:

function checkform()
{
  if(checkempty)
  {
     display_errormessage("One or more fields empty!");
  }
  else
  {
     alert("Thanks for you input!");
  }
 }

The display_errormessage() function is just one that puts an error message into a div at the top of the form to display an error message if the form is incomplete.

Can anyone see where i've gone wrong?

Thanks in advance for any help!

Dave.

share|improve this question
1  
Your code is only checking the first element in the array in your loop. I think you meant to say if (!myArray[i]) rather than if (!myArray[0]) ? –  kinakuta May 5 '12 at 4:32
    
Just changed the code but after filling out all the fields it is still insisting that one of the fields is still empty rather than giving me the alert box with a thank you message. Any ideas?? –  GeordieDave1980 May 5 '12 at 4:36
add comment

4 Answers

up vote 0 down vote accepted

First, function checkform is not called. The if (checkform) should be if (checkform()) or you will test only test the availability of the function, not the result.

Then the if (!myArray[0]) should be if (!myArray[i]) to not only test the firstname

Or better, if (myArray[i].length==0) to be sure to explicitly test for empty string and not just doing an implicit boolean conversion (javascript evaluate 0=="" as true)

share|improve this answer
add comment
up vote 0 down vote

if(!myArray[0]) should be if(!myArray[i]), but a larger point is you're only validating that the value isn't falsey (null, '', 0, false, etc.), not that it's appropriate for the task.

share|improve this answer
    
I've no idea why its not doing it properly. I want to loop through the array and find out if any of the fields are empty and then if they are display an error message if not then display an alert box saying thanks for input! I tried this: if(myArray[i] == null || myArray[i] == "") { return true; } that didn't work either :-( –  GeordieDave1980 May 5 '12 at 4:41
add comment
up vote 0 down vote

Guess you won't need this function as you've already fixed yours, but I'll leave it here as it may be helpful in the future. JSFiddle

function checkform()
{
    arr1 = document.getElementsByTagName('input');
    arr1 = Array.prototype.slice.call(arr1);
    arr2 = document.getElementsByTagName('textarea');
    arr2 = Array.prototype.slice.call(arr2);
    arrs = arr1.concat(arr2);

    for(i=0;i<arrs.length;i++)
    {
        if (arrs[i].type == "text" || arrs[i].type == "textarea")
        {
            if (arrs[i].value == '')
            {
                alert("Fill all fields before submitting!");
                return false;
            }
        }
    }
    alert("Thanks for your input!");
    return true;
}
share|improve this answer
    
Unfortunately one of them is a textarea for giving comments and of course one of the inputs is a submit button. –  GeordieDave1980 May 5 '12 at 4:44
    
Done it! Thank you for the help there, I realised where I went wrong after looking at the code you suggested. –  GeordieDave1980 May 5 '12 at 4:51
    
Oh glad I could be of help :P I've also revised my function, it should work as intended now for input texts and textareas. –  Fabrício Matté May 5 '12 at 5:07
add comment
up vote 0 down vote

According that your input fields are in the form named form:

var allTrue = [].every.call( document.forms.form.elements, function( el ) {
    return !!el.value;
} );
if ( allTrue ) {
    alert( "Thanks for your input!" );
}
else {
    alert( "Some fields are missing!" );
}
share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.