How to call inline onclick after external event - javascript/jquery?

Question

Basically I have an a button as follows:

<button onclick="productAddToCartForm.submit(this) " class="js-checkBackOrdered" type="button">Add to Cart</button>

And I have these JS codes:

jQuery(".js-checkBackOrdered").click(function(){

    if(jQuery("#backordered").length>0){
        showpopup();
        //should not execute the inline onclick here
    }
});

jQuery("#confirmbtn").click(function(){
    //execute the inline onclick event here
})

jQuery("#closebtn").click(function(){
    closepopup();
    //do not proceed with the inline onclick event
})

The problem I am having is, everytime I click on the button, the inline onclick is firing simultaneously with the external event.

How to stop this and execute the productAddToCartForm.submit(this) afterwards?

Please help.

Answer 1

Basically you are trying to bind multiple handler to an event. you need to define you order in which to want to call them.
you can do it

<button class="js-checkBackOrdered" type="button">Add to Cart</button>
jQuery(".js-checkBackOrdered").click(function(){

        if(jQuery("#backordered").length>0){
            showpopup();
          }
          productAddToCartForm();
        });  
function productAddToCartForm(){
//you code
}