Redirect when removing items from cart - Impulse Theme

Store Design
,
1

Hi

When I’m removing products from my cart at the right handside from my screen, it will change screens.

You will no longer see the drawer cart at the right handside but instead you’ll be redirected to a new cart page.

Is there a way to stop the redirect?

TLDR: right hand side cart will change to last image upon removal of a product. I don’t want this, can you stop that?

righthandside.png
righthandside.png2175×1076 280 KB

afer removing.png
afer removing.png1601×960 76.2 KB

/Kr

Dries

2

Hi @Boothable ,

Yes, this issue occurs when the cart drawer is not properly handling updates via AJAX and instead forces a full-page reload upon item removal.

Here’s how to fix it:

Enable AJAX for Cart Updates:

Open your theme’s JavaScript file (usually in theme.js or cart.js).

Ensure that product removal is handled via AJAX instead of a page reload.

Modify the Product Removal Event:

Look for an event listener on the “Remove” button.

If the event triggers a window.location.href change to /cart, modify it to update the drawer without redirection.

Example Code Fix:

$(document).on('click', '.cart__remove', function(event) {
event.preventDefault();
var removeURL = $(this).attr('href');

$.ajax({
type: 'POST',
url: removeURL,
success: function(response) {
// Update cart drawer without redirecting
$('.cart-drawer').html($(response).find('.cart-drawer').html());
}
});
});

If using Vanilla Javascript:

document.querySelectorAll('.cart__remove').forEach(button => {
button.addEventListener('click', function(event) {
event.preventDefault();
fetch(this.href, { method: 'POST' })
.then(response => response.text())
.then(html => {
document.querySelector('.cart-drawer').innerHTML =
new DOMParser().parseFromString(html, 'text/html')
.querySelector('.cart-drawer').innerHTML;
});
});
});

Check Your Theme Settings:

Some themes have a built-in setting to enable “AJAX Cart” or “Drawer Cart.” Look in Online Store → Themes → Customize → Cart Settings.

Check Shopify Cart Liquid Files:

If the theme forces a redirect in cart.liquid or cart-template.liquid, disable it.

If you’re using a third-party Shopify theme, it might have its own script handling the cart.

Let me know what theme you’re using, and I can give you more specific guidance!

Regards,

3

Hi

Already thanks for the lengthy support, however I’m not the most competent person working with code.

I’m using the Impulse version: 7.6.1 at the moment.

I’m searching in the theme.js code, but having difficulties locating the right segment.

/kr

Dries

4

Hi

Did you already have time to look further into this?

/Kr

Dries

5

<a

href="#"

class="text-link js-cart-remove"

data-line-key="{{ product.key }}"

aria-label="Remove item"

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">

  <path d="M11.5 8.25a.75.75 0 0 1 .75.75v4.25a.75.75 0 0 1-1.5 0v-4.25a.75.75 0 0 1 .75-.75Z"></path>

  <path d="M9.25 9a.75.75 0 0 0-1.5 0v4.25a.75.75 0 0 0 1.5 0v-4.25Z"></path>

  <path fill-rule="evenodd" d="M7.25 5.25a2.75 2.75 0 0 1 5.5 0h3a.75.75 0 0 1 0 1.5h-.75v5.45c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311c-.642.327-1.482.327-3.162.327h-.4c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311c-.327-.642-.327-1.482-.327-3.162v-5.45h-.75a.75.75 0 0 1 0-1.5h3Z"></path>

</svg>

Here is updated code

6 
document.addEventListener('click', function (e) {
  const removeBtn = e.target.closest('.js-cart-remove');
  if (!removeBtn) return;

  e.preventDefault();

  const lineKey = removeBtn.dataset.lineKey;

  fetch('/cart/change.js', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Accept': 'application/json'
    },
    body: JSON.stringify({
      id: lineKey,
      quantity: 0
    })
  })
  .then(res => res.json())
  .then(() => {
    // 🔥 THIS IS THE IMPORTANT PART
    document.dispatchEvent(new CustomEvent('cart:build'));

    // Keep drawer open
    document.documentElement.classList.add('js-drawer-open');
  })
  .catch(err => console.error('Remove error:', err));
});