如果文本框输入值发生变化，请验证该字段……但如果……

Question

I am trying to validate a few fields using the formvalidator from formvalidation.io but am running into a few problems using it. I need to find out if a textbox (date,telephone,email) has a value (user filled the textbox out) and validate the field. But if the user does not fill out the textbox, do not validate the field. A user may start to fill out the textbox and then delete its contents and if they do this, the field should not be validated. Can anyone help me out with this?

I have tried a few different techniques such as addEventListener and such but I haven't gotten it exactly how I need it.

Here is an example of what I currently have.

   $("#Q_dob_text").change(function () {
    var dob = document.getElementById('Q_dob_text').value;
    if (dob !== '') {
        $('#registry').formValidation({
            framework: 'bootstrap',
            icon: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                dob: {
                    validators: {
                        date: {
                            format: 'MM/DD/YYYY',
                            message: 'The value is not a valid date'
                        }
                    }
                }
            }
        });
    }
});

And I have also tried variations of this too...

 document.getElementById('Q_date_text').addEventListener("keydown", dateFx);
    function dateFx() {
        var date = document.getElementById('Q_date_text');
        if (date !== '') {
            $('#registry').formValidation({
                framework: 'bootstrap',
                icon: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    date: {
                        validators: {
                            date: {
                                format: 'MM/DD/YYYY',
                                message: 'The value is not a valid date'
                            }
                        }
                    }
                }
            });
        }
    }

Any help is greatly appreciated!

Answer 1

What's going wrong is that the .formValidation call initializes (binds) the plugin to always validate, so as soon as you've run that code once, it will always keep working (even though a user removes the entered text).

What you really want to do is initialize it once, and update it's validation settings (in the validators setting) to make it not validate the dob (from your first example) if it's empty. You could do so by calling "updateOption" or "removeField", see the documentation .