user2551541
user2551541

Reputation: 1

Checking if input values are empty

I'm trying to create a tool that allows users to generate CSS code. At the moment I'm working on input - when a user leaves a text input empty, I'd like a message to appear. The code I have at the moment doesn't seem to work in doing so, any ideas?

$("#btn-css").click(function() {
    if( $('input').attr(value) = "" ) {
      $('#output').append('All boxes must be completed');
    } else {
      $('.preview').attr('style', 'box-shadow: ' + $("#h-value").val() + 'px ' + $("#v-value").val() + 'px ' + $("#blur").val() + 'px ' + $("#spread").val() + 'px #' + $("#colour").val() + ';');
      $('#output').append('box-shadow: ' + $("#h-value").val() + 'px ' + $("#v-value").val() + 'px ' + $("#blur").val() + 'px ' + $("#spread").val() + 'px #' + $("#colour").val() + ';');
    }
    });

Upvotes: 0

Views: 129

Answers (4)

bipen
bipen

Reputation: 36551

use .val().. val() does the exact same thing you mentioned..

if( $('input').val() == "" ) {

to check for all input..

var inputVallength=$('input').filter(function(){
       return this.value==""
   }).length;

if(inputVallength == 0 || inputVallength < $('input').length){
 $('#output').append('All boxes must be completed');  
}

Upvotes: 1

RobH
RobH

Reputation: 3612

How about this it will select all text inputs on the page then filter them to be the ones that are empty.

$("#btn-css").click(function() {
    var emptyInputs = $('input:text').filter(function() { return this.value == ""; });
    if (emptyInputs.length === 0) {
        // Everything filled in

    } else {
        $('#output').append('All boxes must be completed');
    }

});

You might also want to do:

var emptyInputs = $('input:text').filter(function() { return $.trim(this.value) == ""; });

This will also pick up text inputs with just whitespace.

Upvotes: 1

Ohgodwhy
Ohgodwhy

Reputation: 50808

Just do

$(':input').each(function(){
    if(!$(this).val()){
        //logic
    }
});

a Quick fiddle

Upvotes: 0

Brad M
Brad M

Reputation: 7898

$('input').attr(value)

This selects ALL input elements on the entire page.

And also what @Mike Christensen said, you need at least 2 equal signs.

Upvotes: 0

Related Questions