Validate all form fields on submit

Question

Basically what i'm doing is passing 8 form input values to a Javascript Ajax file, during this process i want to do an

if(in_array(all form values) == 'empty') {

Here is the current code i'm using

if($("#merchant").val()==='') {
        //prevent submit button to sending to the handler page
        event.preventDefault();
        //popup the alert
        $("#response").html("<br/><div class='alert alert-error'>Please enter a Merchant Name</div>");
        $("#response").slideDown('slow');
        slideout();
        $("#loading").fadeOut('slow');
}

But using this code i have to copy and paste it about 8 times for each field, which i would rather do an array check if possible.

Is this possible with Javascript ? if so how ?

Answer 1

Iterate over the :inputs of the form like this, assuming your in a submit event and the form is this

$(':input', this).each(function(e) {
    if ($(this).val() === '') {
        // do your stuff
    }
});

You could also potentially attach your error message as a data-attribute and reference it like this

<input type="text" ... data-error-msg="Some Error Message"/>

$(this).data('error-msg');

Answer 2

This function works perfect

function in_array(item,arr) {
     for(p=0;p<arr.length;p++) if (item == arr[p]) return true;
     return false;
}

Use it like this

if(in_array("value", myarray))
{
   // Do something
}

Answer 3

This will only select elements that are empty:

$(".my-class:empty").each(function() {
    // Do things
});