Question

I think I’m having a problem with the this element in the code below

I’m trying to call a function in two way’s but the second way dosen’t work:

The function validate_email is not responding, I think the call for it is wrong in the second example.

The working way is:

checking = {};
checking.form = function(){
    return{

validate_mail: function(a){
    var c=true;
    var email_filter = /^[\w.-]+@[\w.-]+([\.]+([\w]+[\.])?)+[a-zA-Z]{2,6}$/i;
    if( $.trim(a)!=""  && !$.trim(a).match(email_filter) )
    c=false;
    return c;
},
check_mail: function(div_id, error) {

        var email = $(div_id + ' input[name=email]').val();
        var check = this.validate_mail(email);
        if(check==false && $(div_id).is(':visible') )
         {
            $(div_id + ' '+ error).html('<b>some error</b>');   
        } else {
            $(div_id + ' ' + error).text('');
        }

    }
 }
}();


$(function(){
    $('#register input[name=email]').blur(function(){
         checking.form.check_mail("#register", ".error_email");
         });
}

The not working way is:

checking = {};
checking.form = function(){
    return{

validate_mail: function(a){
    var c=true;
    var email_filter = /^[\w.-]+@[\w.-]+([\.]+([\w]+[\.])?)+[a-zA-Z]{2,6}$/i;
    if( $.trim(a)!=""  && !$.trim(a).match(email_filter) )
    c=false;
    return c;
},
check_mail: function(div_id, error) {
            return function(){ //**made the change  nr. 1**

        var email = $(div_id + ' input[name=email]').val();
        var check = this.validate_mail(email);
        if(check==false && $(div_id).is(':visible') )
         {
            $(div_id + ' '+ error).html('<b>some error</b>');   
        } else {
            $(div_id + ' ' + error).text('');
        }
      }
    }
 }
}();


$(function(){ //**made the change nr. 2**
    $('#register input[name=email]').blur(   
         checking.form.check_mail("#register", ".error_email")
        );

}

I need some help with this. I believe I’m not useing the this element in the right way

Any help is appreciated !!

Answer 1

When you return the anonymous function, this doesn’t refer to the owner object. you can store the value of this in some variable before returning the function and use it instead of this:

...
var that = this;

return function(){
  that.validate_mail(...);
}
...