SimpleCart additional information with custom columns

Question

I am using the SimpleCart Javascript Library.

I want to add an id to each product and when the user proceeds to checkout, these id's would be sent as well.

Instead of these columns, for example:

Name   Price
book   5$

I want to have a Product Id column include as well:

Id   Name   Price
3    book   5$

I've tried inserting the id into the options, but I had no luck doing so.

Can someone show me a detailed example doing so?

Answer 1

This can be set up like this:

In your simplecart set up under "cartColumns" add

{ attr: "id" , label: "ID" }

Like this:

cartColumns: [
        { attr: "image", label: "Item", view: "image"},
        //Name of the item
        { attr: "name" , label: "Name" },
        { attr: "id" , label: "ID" },
                    //etc………

Then you can use either:

<span class="item_id">ID:1</span>

or like this:

simpleCart.add({ name: "Shirt" , price: 4, id: 1 });

and it should show up in your columns.

Answer 2

Based on the documentation examples for item.get and item.set you should be able to set your own columns.

var myItem = simpleCart.add({ productId: "A12", name: "Awesome T-Shirt" , 
                              price: 10 , size: "Small" });

myItem.get( "productId" ); // A12
myItem.set( "productId" , "C54" );
myItem.get( "productId" ); // C54

Also, each item has a built-in ID: simpleCart.Item.id()

var myItem = simpleCart.add({ name: "Shirt" , price: 4 });
myItem.id(); // "SCS-1"

You could also create a custom view for your own ID.

CREATING YOUR OWN VIEW

You can create custom views for the cart by setting the view to a function instead of a string. The function should take two arguments, the item for that row, and the column details you specify.

{ view: function( item , column ){
        // return some html
  } ,
  label: "My Custom Column" 
}