I am using this below code for button click event using jQuery. When button is clicked the page reloads.
$('#button1').click(function () {
//Code goes here
return false;
});
To do not refresh the page we add event. preventDefault(); at the end of our JavaScript function.
Your page is reloading because the button is submitting your form. The submit will, by default, re-load the page to show form errors or the result of the submit action. The cleanest fix is, as you discovered, to specify a button type.
Use jQuery's submit event to handle the form submit, add return false; at the end of the submit handle function to prevent the page to reload. return false ; }); });
You can use event.preventDefault()
to prevent the default event (click) from occurring.
$('#button1').click(function(e) {
// prevent click action
e.preventDefault();
// your code here
return false;
});
If your "button" is a button
element, make sure you explicity set the type
attribute, otherwise the WebForm will treat it as submit by default.
<button id="button1" type="button">Go</button>
If it's an input
element, do so with jQuery with the following:
$('#button1').click(function(e){
e.preventDefault();
// Code goes here
});
Read more: event.preventDefault()
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With