Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Armando Amador
Armando Amador
6,813 Points

Code Challenge: Form Validation and Manipulation > Checking Values: 3 of 3

Create a method called 'containsBlanks' that returns true if any inputs with class 'required' has an empty string in, false if not.

I can't seem to figure this one out.

I know the steps are

  • Create a function
  • Create an array in the function
  • Cycle over ".required"
  • Push if the input is empty on to the array
  • Return if the array has any trues

But I'm having difficulties with steps 4 and 5 Check below my current code

    function containsBlanks(){
    var $req = $('.required');
    var myArray = new Array();
    $req.each(function() {
        myArray.push($(this).val === "");
    });
    return myArray.sort().pop();
    }

1 Answer

Jake Chapman
Jake Chapman
4,535 Points
Jake Chapman
Jake Chapman
4,535 Points

Hey armando,

Looks like your never checking if anything is even true or false.

function containsBlanks(){
    var $req = $('.required');
    var containsBlanks = false;

    $req.each(function() {
        if ( $(this).val == "" ) {
            containsBlanks = true;
        }
     });
    return containsBlanks;
}

Try something like this. What this is doing getting all fields with .required, then creating a variable called containsBlanks and setting it to false. So before looping through each .required field, the form contains no blanks. Then while looping through the .required fields, if a field value is blank then set containsBlanks to true, then after looping through each .required field just return the value of containsBlanks.

You can then use this function on form submit. like so.

$(myForm).on('submit', function() {
    // stop the form from normally firing and submitting.
    e.preventDefault();

    // run the containsBlanks function and see if its true.
    if ( containsBlanks() ) {
      // containsBlanks has returned true, which means there are blank fields 
   } else {
      // containsBlanks has returned false, all fields are good to go.
     $(this).submit();
   }
});
Armando Amador
Armando Amador
6,813 Points

Hey jake,

Thanks for the explanation. Didn't know i could do it that way.

I noticed that my mistake was that i used "===" instead of "==" Check the code below

function containsBlanks(){
var blanks = new Array();
$(".required").each(function(){
     blanks.push($(this).val() == "");
});
return blanks.sort().pop();
}

I passed the challenge with this code.