Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: My "add to cart" button redirects directly to checkout and i dont want this...

My "add to cart" button redirects directly to checkout and i dont want this...

Aryu26
New Member
11 0 0

Hi everyone,

 

I need help in fixing an issue. When clicking on my "add to cart" button, I am immediately redirected to the checkout page. but I would like the customers to come to the cart page first so that I can upsell something to them there. how can I fix this issue? (I am not sure if I edited some code in the past to make this happen) 

Even when I do the dynamic checkout button both buttons redirect to the checkout. So now I only have one button saying buy now. 

 

Replies 4 (4)

Shadab_dev
Shopify Partner
895 49 88

If you are someone who understands code, then you just probably need to look for the js handling the click event on the add to cart button and this code

 

location.href = '/cart'

 

If you have any queries please reach out via mail for a convenient conversation 

 

Thanks

Buy me Coffee, if you feel i was helpful. Email Me or WhatsApp me for any help with shopify theme customizations or any project in web dev. If this is helpful, please Like and Accept the solution.
Aryu26
New Member
11 0 0

Its a sense theme and the 2 files which I think so that handle click event are buy-buttons.liquid and cart-product.liquid. what to do now?

Shadab_dev
Shopify Partner
895 49 88

Got it. So inside product-form.js file look for this function onSubmitHandler, will be around line 20. Just before the closing bracket of this function which will be around line 102 if you havent added any code before add this: location.href='/cart';

This should direct user to cart page with add to cart featureworking as normal.

Buy me Coffee, if you feel i was helpful. Email Me or WhatsApp me for any help with shopify theme customizations or any project in web dev. If this is helpful, please Like and Accept the solution.
Aryu26
New Member
11 0 0
if (!customElements.get('product-form')) {
  customElements.define(
    'product-form',
    class ProductForm extends HTMLElement {
      constructor() {
        super();

        this.form = this.querySelector('form');
        this.variantIdInput.disabled = false;
        this.form.addEventListener('submit', this.onSubmitHandler.bind(this));
        this.cart = document.querySelector('cart-notification') || document.querySelector('cart-drawer');
        this.submitButton = this.querySelector('[type="submit"]');
        this.submitButtonText = this.submitButton.querySelector('span');

        if (document.querySelector('cart-drawer')) this.submitButton.setAttribute('aria-haspopup', 'dialog');

        this.hideErrors = this.dataset.hideErrors === 'true';
      }

      onSubmitHandler(evt) {
        evt.preventDefault();
        if (this.submitButton.getAttribute('aria-disabled') === 'true') return;

        this.handleErrorMessage();

        this.submitButton.setAttribute('aria-disabled', true);
        this.submitButton.classList.add('loading');
        this.querySelector('.loading__spinner').classList.remove('hidden');

        const config = fetchConfig('javascript');
        config.headers['X-Requested-With'] = 'XMLHttpRequest';
        delete config.headers['Content-Type'];

        const formData = new FormData(this.form);
        if (this.cart) {
          formData.append(
            'sections',
            this.cart.getSectionsToRender().map((section) => section.id)
          );
          formData.append('sections_url', window.location.pathname);
          this.cart.setActiveElement(document.activeElement);
        }
        config.body = formData;

        fetch(`${routes.cart_add_url}`, config)
          .then((response) => response.json())
          .then((response) => {
            if (response.status) {
              publish(PUB_SUB_EVENTS.cartError, {
                source: 'product-form',
                productVariantId: formData.get('id'),
                errors: response.errors || response.description,
                message: response.message,
              });
              this.handleErrorMessage(response.description);

              const soldOutMessage = this.submitButton.querySelector('.sold-out-message');
              if (!soldOutMessage) return;
              this.submitButton.setAttribute('aria-disabled', true);
              this.submitButtonText.classList.add('hidden');
              soldOutMessage.classList.remove('hidden');
              this.error = true;
              return;
            } else if (!this.cart) {
              window.location.href = window.routes.cart_add_url;
              return;
            }

            if (!this.error)
              publish(PUB_SUB_EVENTS.cartUpdate, {
                source: 'product-form',
                productVariantId: formData.get('id'),
                cartData: response,
              });
            this.error = false;
            const quickAddModal = this.closest('quick-add-modal');
            if (quickAddModal) {
              document.body.addEventListener(
                'modalClosed',
                () => {
                  setTimeout(() => {
                    this.cart.renderContents(response);
                  });
                },
                { once: true }
              );
              quickAddModal.hide(true);
            } else {
              this.cart.renderContents(response);
            }
          })
          .catch((e) => {
            console.error(e);
          })
          .finally(() => {
            this.submitButton.classList.remove('loading');
            if (this.cart && this.cart.classList.contains('is-empty')) this.cart.classList.remove('is-empty');
            if (!this.error) this.submitButton.removeAttribute('aria-disabled');
            this.querySelector('.loading__spinner').classList.add('hidden');
          });
      }

      handleErrorMessage(errorMessage = false) {
        if (this.hideErrors) return;

        this.errorMessageWrapper =
          this.errorMessageWrapper || this.querySelector('.product-form__error-message-wrapper');
        if (!this.errorMessageWrapper) return;
        this.errorMessage = this.errorMessage || this.errorMessageWrapper.querySelector('.product-form__error-message');

        this.errorMessageWrapper.toggleAttribute('hidden', !errorMessage);

        if (errorMessage) {
          this.errorMessage.textContent = errorMessage;
        }
      }

      toggleSubmitButton(disable = true, text) {
        if (disable) {
          this.submitButton.setAttribute('disabled', 'disabled');
          if (text) this.submitButtonText.textContent = text;
        } else {
          this.submitButton.removeAttribute('disabled');
          this.submitButtonText.textContent = window.variantStrings.addToCart;
        }
      }

      get variantIdInput() {
        return this.form.querySelector('[name=id]');
      }
    }
  );
}