CODEWITHSUNDEEP
javascriptjqueryajax
Elias Johannes
Elias Johannes

Reputation: 734

jQuery .keyup() with .bind() doesn't work

I'm using jQuery code to trigger a input field by using the enter key. I used the code in another view and it works perfect. In the new view, somehow it doesn't work at all. The keyup gets triggered but the .bind() function is not called. Here's the HTML trigger:

<div class="form-group">
   <h3>Customers</h3>
   <input class="form-control" id="searchNew" placeholder="Search" name="searchNew" autofocus="" value="@form("searchValue").value">
</div>

This is the jQuery code:

$('#searchNew').bind("enterKey", function(e){
    console.log("Test2");
    $.ajaxSetup({
        beforeSend: function(){
            $('.loading').fadeIn();
        },
        complete:function(){
            $('.loading').fadeOut();
        }
    });
    $.ajax({
        type : 'POST',
        url : '@routes.Application.searchLicensesAdmin()',
        data : $('#search').serialize(),
        success : function (data) {
            $('#license-table').html(data);
            return false;
        },
        error : function (data) {
            console.log("Error");
        }
    });
    return false;
});
$('#searchNew').keyup(function(e){
    if(e.keyCode == 13){
        console.log("Test1");
        $(this).on("enterKey");
    }
});

Test1 gets triggered and shows up in the console, but Test2 is not even triggered at all. So the problem is not the ajax call, but the .bind(). It's probably a stupid reason why it doesn't work but i can't figure it out. jQuery is included in both documents.

Upvotes: 1

Views: 609

Answers (3)

freak007
freak007

Reputation: 88

try this. 

$(this).trigger("enterKey");

it is not recommended to use .bind() as it is deprecated.

Upvotes: 0

giorgio
giorgio

Reputation: 10202

you need $(this).trigger('enterKey').

.bind() and .on() do pretty much the same, although .bind() is deprecated as of version 3 (so don't use it ;)).

The statement $(this).on('enterKey') just registers a new event listener, with an empty / undefined callback

Upvotes: 3

charlietfl
charlietfl

Reputation: 171669

You want to trigger the custom event

Change

$(this).on("enterKey");

To

$(this).trigger("enterKey");

Upvotes: 2

Related Questions