jquery验证，动态绑定表单验证

jquery validate, dynamically binding form validation

本文关键字：验证表单动态绑定 jquery 更新时间：2023-09-26

我正试图在一些地址验证表单的ajax响应上动态绑定验证。我尝试了一些方法，但似乎无法实现。以下是到目前为止我得到的任何帮助，所有控制台日志都在工作。

 $('#profileAddresses form').each(function() {
            console.log('each');
            var _id = $(this).prop('id');
            var _idNum = _id.split('-');
            var _input = _idNum[1];
            var line1 = 'profile' + _input + 'Line1';
            var city = 'profile' + _input + 'City';
            var state = 'profile' + _input + 'State';
            var zip = 'profile' + _input + 'Zip';
            var country = 'profile' + _input + 'Country';
            $(this).validate({
                onkeyup: false,
                errorClass: 'error',
                errorElement: 'div',
                onfocusout: false,
                errorPlacement: function(error, element) {
                    error.insertBefore(element);
                },
                rules: {
                    line1: {
                        required: true
                    },
                    city: {
                        required: true
                    },
                    state: {
                        required: true
                    },
                    zip: {
                        required: true,
                        minlength: 5
                    },
                    country: {
                        required: true
                    }
                },
                messages: {
                    line1: {
                        required: 'Please enter a street address.'
                    },
                    city: {
                        required: 'Please select a city.'
                    },
                    state: {
                        required: 'Please select a state.'
                    },
                    zip: {
                        required: 'Please enter a zip code.',
                        minlengh: 'Pleaes enter a valid zip code.'
                    },
                    country: {
                        required: 'Please select a country.'
                    }
                }
            });
        });

这似乎在其他人遇到这个问题时有效，只需在表单上设置验证，然后将规则添加到输入中。我为每个类添加了一个类，这样我就可以更改所需的消息或要求。

 $('#profileAddresses form').each(function() {
            $(this).validate({
                onkeyup: false,
                errorClass: 'error',
                errorElement: 'div',
                onfocusout: false,
                errorPlacement: function(error, element) {
                    error.insertBefore(element);
                }
            });
            var _id = $(this).prop('id');
            $('#' + _id + ' input').each(function() {
                if($(this).hasClass('profileAddressZip')) {
                    $(this).rules('add', {
                        required: true,
                        messages: {
                            required: 'Required msg.'
                        }
                    });
                }
            });
        });