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