Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    Regular Coder
    Join Date
    Oct 2009
    Posts
    189
    Thanks
    38
    Thanked 3 Times in 3 Posts

    private methods that point to object references in closures

    Hey all,

    I am having issues with below script. Firebug returns:
    form[0] is undefined
    [Break on this error] $(form[0].elements).each(function() {

    I have this under my form:
    <script>
    var thisForm = $('#validateForm');
    thisForm.validation();
    </script>



    Code:
    (function($) {
        /*
        Validation Singleton
        */
        var Validation = function() {
            
            var rules = {
                
                email : {
                   check: function(value) {
                       
                       if(value)
                           return testPattern(value,".+@.+\..+");
                       return true;
                   },
                   msg : "Enter a valid e-mail address."
                },
                url : {
    
                   check : function(value) {
    
                       if(value)
                           return testPattern(value,"https?://(.+\.)+.{2,4}(/.*)?");
                       return true;
                   },
                   msg : "Enter a valid URL."
                },
                required : {
                    
                   check: function(value) {
    
                       if(value)
                           return true;
                       else
                           return false;
                   },
                   msg : "This field is required."
                }
            }
            var testPattern = function(value, pattern) {
    
                var regExp = new RegExp("^"+pattern+"$","");
                return regExp.test(value);
            }
            return {
                
                addRule : function(name, rule) {
    
                    rules[name] = rule;
                },
                getRule : function(name) {
    
                    return rules[name];
                }
            }
        }
        
        /* 
        Form factory 
        */
        var Form = function(form) {
            
            var fields = [];
        
            $(form[0].elements).each(function() {
                var field = $(this);
                if(field.attr('validation') !== undefined) {
                    fields.push(new Field(field));
                }
            });
            this.fields = fields;
        }
        Form.prototype = {
            validate : function() {
    
                for(field in this.fields) {
                    
                    this.fields[field].validate();
                }
            },
            isValid : function() {
                
                for(field in this.fields) {
                    
                    if(!this.fields[field].valid) {
                
                        this.fields[field].field.focus();
                        return false;
                    }
                }
                return true;
            }
        }
        
        /* 
        Field factory 
        */
        var Field = function(field) {
    
            this.field = field;
            this.valid = false;
            this.attach("change");
        }
        Field.prototype = {
            
            attach : function(event) {
            
                var obj = this;
                if(event == "change") {
                    obj.field.bind("change",function() {
                        return obj.validate();
                    });
                }
                if(event == "keyup") {
                    obj.field.bind("keyup",function(e) {
                        return obj.validate();
                    });
                }
            },
            validate : function() {
                
                var obj = this,
                    field = obj.field,
                    errorClass = "errorlist",
                    errorlist = $(document.createElement("ul")).addClass(errorClass),
                    types = field.attr("validation").split(" "),
                    container = field.parent(),
                    errors = []; 
                
                field.next(".errorlist").remove();
                for (var type in types) {
    
                    var rule = $.Validation.getRule(types[type]);
                    if(!rule.check(field.val())) {
    
                        container.addClass("error");
                        errors.push(rule.msg);
                    }
                }
                if(errors.length) {
    
                    obj.field.unbind("keyup")
                    obj.attach("keyup");
                    field.after(errorlist.empty());
                    for(error in errors) {
                    
                        errorlist.append("<li>"+ errors[error] +"</li>");        
                    }
                    obj.valid = false;
                } 
                else {
                    errorlist.remove();
                    container.removeClass("error");
                    obj.valid = true;
                }
            }
        }
        
        /*
        Validation extends jQuery prototype
        */
        $.extend($.fn, {
            
            validation : function() {
                
                var validator = new Form($(this));
                $.data($(this)[0], 'validator', validator);
                
                $(this).bind("submit", function(e) {
                    validator.validate();
                    if(!validator.isValid()) {
                        e.preventDefault();
                    }
                });
            },
            validate : function() {
                
                var validator = $.data($(this)[0], 'validator');
                validator.validate();
                return validator.isValid();
                
            }
        });
        $.Validation = new Validation();
    })(jQuery);
    Last edited by johnmerlino; 08-22-2010 at 06:50 PM.


 

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •