SnipCart redirect to my custom thank you page URL on my MVC C# site

Question

I am using Snipcart version v3.3.0 as a shopping cart on my site I built in MVC using C#. The shopping cart works fine and I am able to complete transactions.

The problem I am having is that I would like to navigate the user to my own thank you page on my site once they complete their transaction. Currently when you complete checkout using Snipcart, by default it just displays their thank you page in the side cart checkout modal.

I have read a few posts on how to accomplish what I want but none have worked. I keep getting this browser console error that says Uncaught TypeError: Snipcart.subscribe is not a function

<script>
document.addEventListener('snipcart.ready', function () {
    Snipcart.subscribe('order.completed', function (order) {
        var url = '/thankyou?order=' + order.token;
        window.location.href = url;
    });
});

I have even tried using the .execute method as one of the posts suggests but that did not work either. Uncaught TypeError: Snipcart.execute is not a function

<script>
document.addEventListener('snipcart.ready', function () {
    Snipcart.execute('order.completed', function (order) {
        var url = '/thankyou?order=' + order.token;
        window.location.href = url;
    });
});

My guess was that I was missing a reference or something to the snipcart.js. But after double checking multiple times I came to the conclusion that I am not missing the snipcart.js reference at all, I am in fact calling it before I call these 2 snippets above. Also, the cart is working because it's referencing the snipcart.js , so I know for a fact I am not missing that reference.

Another thought is that since I am using version 3.0.0, some of the JavaScript might be different for this implementation to work on this version. The documentation page on their site where the info would be is empty. Click here

Whereas the documentation for version 2.x shows the code that I was trying out. Click here

Can anyone guide me through this? This is where I got the information on Redirecting The User to A Custom Thank You Page You have to scroll to the bottom where they talk about taking the user to your own thank you page.

This one also shows a snippet of code that I tried but did not work for me

Answer 1

It seems that you are using v3, however, the events that you are listening to are for v2. You would need to listen to this event https://docs.snipcart.com/v3/sdk/events#cartconfirmed for v3.

You could listen to the cart.confirmed event and redirect the customer to the page of your choice using native browser API (location.href).