Question

I have a input on page in some div:

<input style='border:1px solid black;' type='text' id='inputFindBy_Name' />

and o jquery javascript function monitored it:

 $("div[id=mainGridPage] input").bind("keyup", function (event) {
            if (event.keyCode == 13) {
                var searchField = "Name";
            var searchValue = $(this)[0].value;
            var pageIndex = "1";
            var sortField = "Name";
            Application.Services.ProductTypeService.LoadMainGridProductType(pageIndex, sort, sortField, searchField, searchValue, ResultLoadMainGridProductType, ErrorLoadMainGridProductType);
            }
        });

when user typed something and pressed ENTER (event.keyCode == 13) I need do some thing but without reloading the page. How do that?

Answer 1

Just return false from within the function:

var code = event.keyCode || event.which;
if (code == 13) {
    // do what you have to do.....
    return false;
}

Edit: the keyup event is triggered “too late” after the form submission event was already dispatched – you can’t cancel or stop it in that stage. So, handle the keypress event instead. Change the line to:

$("div[id=mainGridPage] input").bind("keypress", function (event) {

And the return false; will indeed stop the form from submitting.

Live test case.