How to click on an input type“submit” button without submiting the whole form

Question

I am trying to click the following line of code:

<input title="Add To Cart" name="pdp_addtocart" value="Add To Cart" type="submit" class="active_step">

I have tried the .click() form and it doesnt work. I need the code in javascript.

Answer 1

Try adding the onclick event to the button:

<input onclick="return false;".... />

return false in the event will halt the form submission.

or using pure javascript:

theButton.onclick = function() {
    return false;
};

Edit:

jQuery version:

$theBtn.click(function() {
    return false;
});

Answer 2

With Jquery :

var my_btn = $('input[name="pdp_addtocart"]');

my_btn.click(function(event){
 event.preventDefault(); //This avoid  the default behavior of the button
  //Your Stuff
});

In case your form still sending add this line:

   $('form').submit(function(event){
     event.preventDefault(); //This avoid the behavior of sending the form
    });

Answer 3

Does it have to be a <input type="submit" /> ?

You could use a <input type="button" /> instead.