Alerting user while submitting if mandatory inputs are not filled

Question

I am a Python developer and I have been working on Vuejs app.

If have function that is equivalent of a() in python that takes iterables. and if all items in iterable are true than all([...]) returns true

methods: {
    all: function(iterable) {
        for (var index = 0; index < iterable.length; ++index) {
            if (!iterable[index]) return false;
        }
        return true;
    }
}

and here is how I validate.

 if (this.all([
                        this.age,
                            this.gender,
                            this.contactNumber,
                            this.townCity,
                            this.department.name,
                            this.attendType
                        ])
                ) {
                    window.location = "#slip"
                    this.displayState = 'block';
                }
                else{
                    alert("Please fill all required fields.");
                }

but this is not working.

Even if I fill all the mandatory fields I have the values in all the this.* attributes still I get alert saying "Please fill all required fields."

Answer 1

In JS, empty string values will return false on your IF statement. You should check this point first.

(Maybe you have to check this topic)

Other thing : Make sure your "departement.name" variable is assigned. Vuejs is not reactive with sub-properties in objects.

Reactivity In Depth (Vue.js)