CODEWITHSUNDEEP
javascriptjquery
input
input

Reputation: 7519

Changing value on keydown event refreshes page

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();
        });

Upvotes: 0

Views: 2006

Answers (3)

Dangelov
Dangelov

Reputation: 700

Change your body to:

if(keycode == '13'){                                                                                              
   if (formValidate()){                                                                                          
      event.preventDefault();                                                                                   
   } else {                                                                                                      
      calculateGravelMetric();                                                                                   
   }                                                                                                             
}                                                                                                                 
return false;

... thus the default handling will always be prevented

Upvotes: 0

Rohan
Rohan

Reputation: 1805

try adding event.stopPropagation() after event.preventDefault()

Upvotes: 0

Manse
Manse

Reputation: 38147

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();
    });

Upvotes: 1

Related Questions