Question

I’m using jQuery to make a calculator. The issue is that on keydown, I call the calculate function which calculates and returns the value. However, if I change the value in the textbox, and press keydown again, the page refreshes and everything is blank.

I don’t want the page to refresh, if the user changes the value in the textbox. It should call the calculate function again and return and display the new result.

This is the code:

lgpm.keydown(function(event){

            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
                if (formValidate()){
                    event.preventDefault();
                    return false;
                }
                else {
                calculateMet();
                }
            }
            event.stopPropagation();
        });

Answer 1

The event.preventDefault() method needs to be called whenever the enter key is pressed – else it will submit the form – try this

lgpm.keydown(function(event){

        var keycode = (event.keyCode ? event.keyCode : event.which);
        if(keycode == '13'){
            event.preventDefault();
            if (formValidate()){
                return false;
            }
            else {
            calculateMet();
            }
        }
        event.stopPropagation();
    });