call function with parameters on any event using jquery

Question

Hi just wanted to know if this is a correct way. I know we can pass data using object notation and use it. But just wanted to know if the below code is correct. I am not sure about the below syntax.

 function isValid(errMessage,errId,errClass){
    alert();
    if($("#"+errId).val()==""){
        $("."+errClass).show();
        $("."+errClass).html(errMessage);
        return false;
    }else{
        $("."+errClass).hide();
    }
}

$("#fname").on("blur",isValid("please enter first name","fname","ferror"));

I have seen syntax like below:

function test(){
    alert("Hello World");
} 
$("#fname").on("blur",test);

check this link for output http://jsfiddle.net/susheel61/M2jsX/

so just want to make clear if passing parameters directly works or not.

Your jsfiddle uses a function call not a reference to a function. jsfiddle.net/M2jsX/1 — Konstantin Dinev
– Konstantin Dinev, Commented May 28, 2013 at 13:48

Claudio Redi · Accepted Answer · 2013-05-28 12:41:19Z

3

Your code call isValid method and assign result as blur handler so it's not exaclty right. You should do something like this

$("#fname").on("blur",function(){
    isValid("please enter first name","fname","ferror")
});

It seems there are other improvements you could do. The most obvious for me is pass this.id instead of harcoding the id

$("#fname").on("blur",function(){
    isValid("please enter first name", this.id, "ferror")
});

answered May 28, 2013 at 12:41

Claudio Redi

68.6k15 gold badges138 silver badges161 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Susheel Singh Over a year ago

yeah I know this one. But I have seen syntax like: function test(){ alert("Hello World"); } $("#fname").on("blur",test); so just want to make clear if passing parameters directly works or not

Claudio Redi Over a year ago

@susheel: I'm afraid I'm not sure what's your question. Your code as it is doesn't work. You have 2 working alternatives here.

Susheel Singh Over a year ago

I think my syntax is not valid. Just wanted to know if that exists. thanks.

Claudio Redi Over a year ago

@susheel: notice that instead of attaching method to blur is executing it. So in short, it's not working as you would expect.

Susheel Singh Over a year ago

yep. So I think I should pass as object or else follow your way :)

Konstantin Dinev · Accepted Answer · 2013-05-28 12:44:58Z

1

You can pass arguments to the event handler as a parameter to your event listener:

$("#fname").on("blur", {
        msg: "please enter first name", 
        name: "fname", 
        error: "ferror"
    }, isValid);

Then your isValid function can handle the data from the event object:

function isValid (event) {
    var errMessage = event.data.msg,
        errId = event.data.name,
        errClass = event.data.error;
    if ($("#"+errId).val()=="") {
        $("."+errClass).show();
        $("."+errClass).html(errMessage);
        return false;
    } else {
        $("."+errClass).hide();
    }
}

answered May 28, 2013 at 12:44

Konstantin Dinev

35k14 gold badges79 silver badges102 bronze badges

3 Comments

Susheel Singh Over a year ago

$("#fname").on("blur",isValid("please enter first name","fname","ferror")); Other options I knew. Just wanted to know if this syntax is legid. thanks

Konstantin Dinev Over a year ago

@susheel it is not. your function call yeilds a result - isValid() and the result is undefined. In this way you provide as a parameter an undefined event handler.

Susheel Singh Over a year ago

function test(){ alert("Hello World"); } $("#fname").on("blur",test); this syntax works So just thought even parameter thing should work. But I was wrong. Anyways thanks :)

Collectives™ on Stack Overflow

call function with parameters on any event using jquery

2 Answers 2

5 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related