JQuery не будет фильтровать, используя значение

Question

Я пытаюсь создать простую функцию, которая будет сообщать мне, когда все выпадающие списки в div были выбраны. Кажется, проблема в том, что фильтр ничего не выбирает, поэтому длина всегда равна 0. Есть идеи, что может происходить? Вот что у меня так далеко:

JQuery

$('.month, .year').change(function () {
    var $this = $(this);
    var $empty = $this.parent().parent().find('.month, .year').filter('[value=""]').length;
    if ($empty == 0) {
        alert('there are no empty dropdowns');
    }
});

HTML

<form class="date_catcher">
    <div style="display:inline;" class="start">
        <select class='input-small month' name='month'>
            <option value='' selected='selected'>---</option>
            <option value='0'>Jan</option>
        </select>
        <select class='input-small year' name='year'>
            <option value='' selected='selected'>----</option>
            <option value="2012">2012</option>
        </select>
    </div>

    <div style="display:inline;" class="end">
        <select class='input-small month' name='month'>
            <option value='' selected='selected'>---</option>
            <option value='0'>Jan</option>
        </select>
        <select class='input-small year' name='year'>
            <option value='' selected='selected'>----</option>
            <option value="2012">2012</option>
        </select>
    </div>
</form>

Спасибо за вашу помощь!

Answer 1

Попробуй это -

var $empty = $this.closest('form').find('.month, .year').filter(function(){
  return this.value === "";
}).length;

демонстрация --> http://jsfiddle.net/J8x5X/

Answer 2

$(".date_catcher select").change(function(){
    $empty = $(".date_catcher option").filter(":selected").filter("[value='']").size();
    if($empty == 0){
        alert("there are no empty dropdowns");
    }
});