Validate all input fields on the page on click with jquery

Question

I'm totally new to jquery, but trying my best.

I have an asp.net mvc project with page full of x-editable inputs. I made this simple button

<input type="button" class="btn btn-info" id="validate" value="Validate document" />

What I want to achieve is after inputs has been filled by the user, I want him/her to push the button and check if all fields has been filled. I made this jquery:

 $('.editable').ready(function () {
        $('.editable').editable('option', 'validate', function (v) {
            if (!v) return 'Field required!';
        });
    })

When I push enter on an empty field it triggers validation.

What I need is to highlight all empty x-editable fields on the page when the #validate is clicked and show "Field required!" message.

Any help would be appreciated

Answer 1

Try this,

$("input:empty").length == 0;

If it's zero, none are empty.

To filter items with just spaces in, you could do:

$("input").filter(function () {
    return $.trim($(this).val()).length == 0
}).length == 0;