Persisting Carts between Devices and ajax cart

To my shopping cart I implemented an ajax system to add and delete products in it.

With the simplecart.storage_type cookie (default) work, but if it uses cache Cart don’t always update.

I must refrain to using cache?

Hi @PMedusa, that sounds odd. The way things are stored with cache is obviously different, but if you can get cookies to work that way I don’t immediately see why it wouldn’t work from the cache.

Could you share how you’ve set up the AJAX system? Maybe there’s something in there that explains why it may not work.

The cache storage type is required for using the persistence between devices feature from 2.4.

Mark,

Did you guys update the way you create the cache key on 2.4? Prior versions use the following:

$cacheKey = sha1($_SERVER['REMOTE_ADDR'].$_SERVER['HTTP_USER_AGENT']);

Across devices and IP you will lose the cache match.

Also if you “Clear Site Cache” in modx manager it wipes everyones carts.

Paolo, just to share I have created a persistent “db” storage type that uses the userid if user is logged in or the same cachekey above if anonymous. This at least keeps persistence across devices if logged in.

Yes, that’s exactly the code that was changed in 2.4 to allow persistence across devices. :wink:

Pretty much implemented the same way you describe your db option, except it writes to file instead of the database.

We can prevent cache clears nuking all carts by writing to a different cache partition, will see if I can fix that in the next release.

Great to hear. Thanks for all the work you do.

Thanks Adam. I’ll also see if we can introduce a database storage type in the core for 2.5, sounds like something that could be useful in certain environments. Out of curiosity, did you choose to write a custom db table or re-use something like the registry?

Hello guys,

I try to explain how I set the Ajax system.

TPL Product:

    ... <form class="formAddProd" action="[[~2216]]" method="post">
    <input type="hidden" name="productid" value="[[+id]]">
    <input type="hidden" name="quantity" class="form-control qty" value="1">
        
    <div class="box-body text-center">
        [[+tv.unitaProd]]<br>
        <span class="pricex">[[+product_price_formatted]]</span>
    </div>

    <div class="box-footer text-center">
        <button class="btn btn-primary btn-block ladda-button" data-style="expand-right" type="submit"><span class="ladda-label">ADD TO CART</span></button>
    </div>
    </form> ...

jQuery code:

    container.on('submit', '.formAddProd', function(event) {
      event.preventDefault();
      var $form = $(this),
      url = $form.attr( "action" ); // get resource (2216) url
      var datapost = $form.serializeArray(); // convert form to array
      datapost.push({name: "addcart", value: ""});
      // Send the data using post
      var posting = $.post(url,datapost);
      console.log(url);
      posting.done(function( data ) {
        console.log('done');
        $("#updminiCart").load("[[~2217]]",function(data){
            UpdateItemsTotal();
        });
      });
    });

Resource ajaxAddProduct (2216) - template empty - cacable = false
[[!scAddProduct]]

Resource ajaxscGetCart (2217) - template empty - cacable = false
[[!scGetCart? &tpl=wrapCart&rowTpl=cartRow&emptyTpl=CartEmpty&rowOptionTpl=CartRowOptions&rowFieldTpl=scCartRowField]]

With simplecart.storage_type set to cache, the first add work, if I add other products, the cart don’t update. To see the updated cart I must refreshare the page several times, and often missing someone.

I noticed that even without an ajax system, the cache storage type causes an update issue of the Cart. Remains one step back. You can see it by adding a few products in this test page

The problem, for some reason is accentuated with the ajax system that I have implemented.

@PMedusa The problem on that page might be caused by the cart snippet being before the add-to-cart snippet. If you add a second product, it doesn’t show up until you refresh the page again and the cart is rendered again.

Hi Mark,

My new code

[[!scAddProduct]]
[[!getResources?
    &parents=`[[*id]]`
    &tpl=`scProductOverviewItem`
    &sortby=`menuindex ASC, id`
    &sortdir=`ASC`
    &limit=`0`
]]

[[!scGetCart]]

test page

I would, however, solve the one with ajax system. Some idea?

Thx