When you are on your store it is handy to be able to know when certain javascript events occur. For example, if you want to send a custom event to Google Analytics whenever someone uses your contact form. Below you will find a list of events and how to subscribe to them.
👍 Important: These events only fire if Javascript is running and will also be dispatched right before a page reload. Thus, potentially not fully sending your events or triggering your actions. If concerned, have a look at webhooks as another solution.
Quote event
Success Code
document.addEventListener('quote-sent', function (e) {
console.log('new quote sent successfully', e.detail)
}, false);
Failure Code
document.addEventListener('quote-failed', function (e) {
console.log('new quote failed to be sent', e.detail)
}, false);
Product Quickview
Success Code
document.addEventListener('product-quickview-success', function (e) {
console.log('product quickview loaded successfully', e.detail)
}, false);
Failure Code
document.addEventListener('product-quickview-failed', function (e) {
console.log('product quickview failed to load', e.detail)
}, false);
Cart Events
Cart Load
document.addEventListener('cart-load-success', function (e) {
console.log('Cart page loaded successfully', e.detail);
}, false);
Add to cart
document.addEventListener('cart-add-success', function (e) {
console.log('added to the cart successfully', e.detail);
}, false);
Update cart totals : Recommended as the most flexible event
document.addEventListener('cart-total-update', function (e) {
console.log('Cart totals updated successfully', e.detail);
}, false);
Remove item from cart
document.addEventListener('cart-remove-success', function (e) {
console.log('Cart item removed successfully', e.detail);
}, false);
Registration pages
Registration from the /register page
document.addEventListener('register-form-success', function (e) {
console.log('User registered successfully', e.detail);
}, false);
Registration button on the Thank you page
document.addEventListener('register-thankyou-success', function (e) {
console.log('User registered successfully', e.detail);
}, false);
Registration in the checkout
document.addEventListener('register-checkout-success', function (e) {
console.log('User registered successfully', e.detail);
}, false);
Variants event
Product variants loaded event
document.addEventListener('product-variants-success', function (e) {
console.log('Variants loaded', e.detail);
}, false);Product variants filters AJAX request
$.ajax({
type: 'post',
url: '/api/product/variant-filters',
cache: false,
data: {
'variant_id': $('.variant-products-wrapper').data('productid'),
'filters': selectedfilters,
},
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
success: function (response) {
productvariantfilters = response['filters'];
// create filters here
},
});Update product variants with filters
selectedfilters.attribute.attribute_id.push(filterId);
selectedfilters.attribute.value_id.push(selectedValue);
variants.fetchVariants();
Configurable Products with customer Javascript
function evoXProductChangeCallback() {
// Add content here, if it needs to be executed on the product page after a user makes selections on a configurable product.
}
Live pricing
document.addEventListener('live-pricing-done', function () {
console.log('live pricing has just finished running');
}, false);
Live inventory
document.addEventListener('live-inventory-done', function () {
console.log('live inventory has just finished running');
}, false);
Default contact form sent
document.addEventListener('contact-form-sent', function (e) {
console.log('Contact form email has been sent', e.detail);
}, false);
Default contact form failed to send
document.addEventListener('contact-form-failed', function (e) {
console.log('Contact form email failed to be sent', e.detail);
}, false);
Search success
document.addEventListener('search-success', function (e) {
console.log('Search has been successful', e.detail);
}, false);
Search - no results
document.addEventListener('search-noresults', function (e) {
console.log('Search returned no results', e.detail);
}, false);
DDS Specs success
document.addEventListener('dds-specs-success', function (e) {
console.log('DDS Specs successfully loaded', e.detail);
}, false);
DDS Specs failed
document.addEventListener('dds-specs-failed', function (e) {
console.log('DDS Specs failed to load', e.detail);
}, false);