Develop Reference

Disabling WooCommerce add to cart button after first click prevents submit

I'm trying to disable the WooCommerce Add to cart button when the user clicks it for two reasons..
To prevent multiple clicks on it
To show the user their click did something
I used this code:
if ($('body').filter('.single-product')) {
var add_cart_button = $('.single_add_to_cart_button');
/* Disable button on add to bag click if button is active */
add_cart_button.on('click', function(e) {
if (!$(this).hasClass('disabled')) {
$(this).prop('disabled', true); // Prevent multi adds
$(this).addClass('disabled');
}
});
}
Whilst this works, it also seems to disable the button even working, the adding of the product doesn't work as the form submit seems to not fire at all.
Why is this happening and what do I need to change here?

Fixed it by doing it with the submit event instead...
Since the form doesn't have a name attribute I had to target it another way:
if ($('body').filter('.single-product')) {
var add_cart_button = $('.single_add_to_cart_button');
add_cart_button.closest('form').on('submit', function(e) {
var cur_atc_button = $(this).find('.single_add_to_cart_button');
if (!cur_atc_button.hasClass('disabled')) {
cur_atc_button.addClass('disabled');
}
});
}
Edit: I removed the below disabling of the button as it seems for some item types it failed to add the item to the cart if you did this:
cur_atc_button.prop('disabled', true); // Prevent multi adds
If anyone knows why please let me know.

Toggle Bootstrap dropdown by click on the link in modal

When a form submitted the modal box appears. This box contains a text with a link. Click on this link should close this box and toggle dropdown (auth form). The problem is that I can't handle toggling the dropdown by clicking this link.
Here is the code of click-handler of this link
$(function() {
$('#open_auth_form').click(function(e) {
e.preventDefault();
$('#participate_modal').modal('hide');
$('#auth_link').dropdown('toggle');
});
});
Why doesn't it work? I tried also to move dropdown toggling inside the 'hide.bs.modal', tried .trigger('click'). Nothing helped. But simple running
$('#auth_link').dropdown('toggle');
from console works well.

Check out this stack overflow question on How to open Bootstrap dropdown programmatically. There are a number of solutions you can try such as:
Triggering the click.bs.dropdown event:
$('#dropdown').trigger('click.bs.dropdown');
Or manually adding/removing the classes:
$('.dropdown').addClass('open'); // Opens the dropdown
$('.dropdown').removeClass('open'); // Closes it

In my case it was enough to add
e.stopPropagation();

Hitting button outside a form to call submit on Submit button in a form

Lets say I have a form with hidden submit button, and I input values in it, then I hit one button and dialog appears with Confirmation message and Confirm button. When I click on Confirm button, I click also on a hidden submit button from a form. Is that possible and how can I achieve it in JQuery?

In your jQuery use code like this:
$("#confirmationButton").on("click" , function () {
$("#submitButton").trigger("click");
});
or
$("#confirmationButton").on("click" , function () {
$("#form").submit();
});
Rememer that you have to set ids to your form and/or formSubmitButton.

Trigger event to click a link

I have a hidden link and a button.
I want when users click on the button they will go to the link.
Why I'm not just show the link so users can click through the link because I don't want users see the link that appear at the bottom of browser.
<a id="stack" href="http://stackoverflow.com/"></a>
<button id="goTo">Stackoverflow</button>
Is it possible?

Maybe like this :
$(document).ready(function(){
$("#goTo").on('click',function(e){
e.preventDefault();
window.location = $("#stack").attr('href');
});
});

Add simple jquery to relay the click on the button. You can leave the a link out.
$("#goTo").click(function(){
window.location = "http://stackoverflow.com/";
}

is it possible to open a popup when a checkbox is checked using jquery?if yes how?

In my application i have popup box whichis initially hidden and there is a checkbox.so when a user checks the checkbox a popupup should open .please help...

$("#myCheckbox").click(function(){
if($(this).is(":checked")){
//Open Popup Window
}
});
Check this Example

Just register it to your click event in the checkbox.
$('.myCheckBox:checkbox').click(function(){
alert('Popup opening code goes here')
});