jQuery, keyup event not firing

Question

I have a problem refactoring a keyup event that I have in my system, the event initially looks like this:

$('#quotation_search_client').on('keyup',function(){
    param=$('#quotation_search_client').val();
    if(param.length>=4){
        var params = {
            social_reason: $('#quotation_search_client').val()
        }
        var clients=ClientServices.getByFilter(params);
        var addresses=ClientServices.getAddresses(clients.clients);
        QuotationServices.fillClients(clients.clients, addresses);      
    }else{
        $('#customers_results').html("");
    }
});

When it's like that, it works perfectly, but when I change it to this:

$('#quotation_search_client').on('keyup',QuotationServices.searchClient({social_reason: $('#quotation_search_client').val()}));

And define the function "searchClient" like this:

    QuotationServices.searchClient = function(params){
        param=$('#quotation_search_client').val();
        if(param.length>=4){
            var clients=ClientServices.getByFilter(params);
            var addresses=ClientServices.getAddresses(clients.clients);
            QuotationServices.fillClients(clients.clients, addresses);      
        }else{
            $('#customers_results').html("");
        }
    };

It stops working, nothing happens when I type something. The console doesn't display any errors so I wrote a console.log at the beginning of the searchClient function and apparently it fires when my page loads, showing that the params.social_reason comes with an empty string, but when I type something, as I said, nothing happens. I don't know what I'm missing, all I did was copy/paste the event's code into the searchClient function and delete the var params (because I'll receive it as a parameter), any help?

Answer 1

You are executing the function right after the declaration of the keyup event, so you are not passing the function to keyup event.

You should instead do:

$('#quotation_search_client').on('keyup',QuotationServices.searchClient);

And change:

QuotationServices.searchClient = function(){
    var params = {social_reason: $('#quotation_search_client').val()}
    var param = $('#quotation_search_client').val();
    if(param.length>=4){
        var clients=ClientServices.getByFilter(params);
        var addresses=ClientServices.getAddresses(clients.clients);
        QuotationServices.fillClients(clients.clients, addresses);      
    }else{
        $('#customers_results').html("");
    }
};