Html button calling jquery and not sending back

Question

Is it possible to have a button that is not sent back to the server, and the click event can be detected using jquery? I have an MVC page that takes some time to load and access the database, and I just want to reduce the number of db loads and deletions required.

Answer 1

Just make the button a regular button instead of the submit button, and then do:

 $("#myButton").click(function () { whatever it is I want to do ... }); 

Answer 2

You can attach any behavior you want to use with jQuery.

Here is your button

 <button class="my-button">click this</button> 

Here is your jQuery

 $("button.my-button").click(function(){ // do something! }); 

If you want to use the submit button on the form, here is a more unobtrusive way:

 $("#some-form input:submit").click(function(){ // do something special! // prevent default behavior of button return false; }); 

Answer 3

If you make a button with <input type="submit"> , it will send the form to the server; but if you use <input type="button"> , it will not, and you can detect the onclick event

Answer 4

You can define a button click event using jquery.

Give and go to this button, call the function with this identifier in the click event.

 $('#buttonid').click(function() { // call ajax here .post() // ajax call or .get() // ajax call }); 

Make a jQuery ajax combination.

http://api.jquery.com/click/

http://api.jquery.com/jQuery.get/