CODEWITHSUNDEEP
javascripthtmlsimplecart
T SzenYew
T SzenYew

Reputation: 1

simplecart js multiple view function

I am trying to integrate simplecart js to a template website , so i wrote this script to style it to follow the template styling .

<script>
simpleCart({
cartColumns: [
{ view: function(item, column){
return  "<li class='header-cart-item'><div class='header-cart-item-img'><img 
src='"+item.get('thumb')+"' alt='IMG'></div><div class='header-cart-item- 
txt'><a href='#' class='header-cart-item-name'>" +item.get('name')+"</a> 
<span class='header-cart-item-info'>"+item.get('quantity')+" x  
RM"+item.get('price')+"</span></div></li>";
}, attr: 'custom' },
]
});
</script>

then i use this to display it 

<div class="simpleCart_item"> </div>

The problem come when i need different arrangement like arrangement for 2 different cart display, i cant create another arrangement using the same script cause it will use affect the first arrangement that i created above , is it a possible way to create a different arrangement script independent from the first one and how to display it .

Please help.

Upvotes: 0

Views: 247

Answers (1)

Dan Rayson
Dan Rayson

Reputation: 1427

If you've got multiple different carts to display, each with their own styling, could you simply apply some css to each one individually? Make a css class that'll override/introduce any styling for your first one, then another css class to style your second one.

Like this:

<style>
    .customStyle1 {
        background: blue;
    }
</style>
<div class="simpleCart_item customStyle1"> </div>

You can mix css classes together :)

Upvotes: 0

Related Questions