Skip to main content
1 of 3

How can I remove duplicate error alert code from my jquery function?

I am new to jquery and implemented following function in a js file in case of error-

function before_submit_check_if_has_blank_field() {
$("[type=submit]").click(function(e) {
    var of_key_field = $('.key_field')
    var of_val_field = $('.val_field')
    var should_run = 1

    if (of_key_field.length === 1) {
        $('.key_field:not(:first)').filter(function() {
            if (this.value === "") {
                alert('Please Fill In Or Remove The Blank Fields First')
                e.preventDefault();
                should_run = 0
            }
        });
    } else {
        $('.key_field').filter(function() {
            if (this.value === "") {
                alert('Please Fill In Or Remove The Blank Fields First')
                e.preventDefault();
                should_run = 0
            }
        });
    }

    if (should_run != 0) {
        if (of_val_field.length === 1) {
            $('.val_field:not(:first)').filter(function() {
                if (this.value === "") {
                    alert('Please Fill In Or Remove The Blank Fields First')
                    e.preventDefault();
                    should_run = 0
                }
            });
        } else {
            $('.val_field').filter(function() {
                if (this.value === "") {
                    alert('Please Fill In Or Remove The Blank Fields First')
                    e.preventDefault();
                    should_run = 0
                }
            });
        }
    }

    update_config_field_from_key_value_field()
});

}

Here I am repeating following lines which must be replaced by standard one-

if (this.value === "") {
                    alert('Please Fill In Or Remove The Blank Fields First')
                    e.preventDefault();
                    should_run = 0
                }

Can anyone please review my code and refactor it?