Skip to content Skip to sidebar Skip to footer
Home / Html / Javascript / Jquery

Find Empty Input Elements Inside A Collection - Jquery

Post a Comment
I am trying to find the empty input types like textbox, select and li elements inside a jQuery resultset. My resultset is (requiredfields) - $requiredFields = $('.f-form-required.

Solution 1:

There is no val property. Try using .val() instead or this.value:

var emptyInputs = 0;
$requiredFields.filter(function(){
    $('input[type=text]').each(function(){
        if (jQuery(this).val()  == "") {
            emptyInputs = emptyInputs + 1;         
        } 
    }); 
});

or:

var emptyInputs = 0;
$requiredFields.filter(function(){
    $('input[type=text]').each(function(){
        if (this.value  == "") {
            emptyInputs = emptyInputs + 1;         
        } 
    }); 
});

Solution 2:

I think you arn't using .filter() quite as it is expected to be used. Consider something like this:

<html><body><div><inputtype="text"id="text1"class="f-form-required f-form-field" /><inputtype="text"id="text2"class="f-form-required f-form-field"value="test" /><inputtype="text"id="text3"class="f-form-required f-form-field" /></div></body></html><scriptsrc="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script><scripttype="text/javascript">functiontest(){
        var $requiredFields = $('.f-form-required.f-form-field');

        var $errorFields = $requiredFields.filter(function () {
            var $this = $(this);
            return $this.is('input') && $this.val() === '';
        });
        var errorCount = $errorFields.length;

        console.log('errors:' + errorCount);
    }


    $(document).ready(function(){
        test();
    }
</script>

Post a Comment for "Find Empty Input Elements Inside A Collection - Jquery"