我正在使用simplecart js。我无法将产品图片的图片来源与购物车中的产品信息一起显示。
图片来源未定义,请参阅演示http://jsfiddle.net/z7xW4/15/
我使用以下代码创建列
<div class="simpleCart_shelfItem">
<img alt="image" src="http://placehold.it/100x100" class="item-image"/>
<a href="javascript:;" class="item_add">Add to Cart</a>
simpleCart({
checkout: {
type: "PayPal",
email: "you@yours.com"
},
cartColumns: [
{view:'image' , attr:'thumb', label: false},
{ attr: "price" , label: "Price", view: 'currency' } ,
{ attr: "quantity" , label: "Qty" } ,
{ attr: "total" , label: "SubTotal", view: 'currency' } ,
{ view: "remove" , text: "Remove" , label: false }
],
cartStyle: "table"
});
答案 0 :(得分:3)
使用此代码解决
{ view: function(item, column){
return"<img src='"+item.get('image')+"'>";
},
attr: 'image' },
答案 1 :(得分:2)
在你的答案和挖掘的基础上,我发现这个解决方案使用javascript simpleCart.add()函数而不是html配置来定义项目。这适用于simpleCart v3(使用v3.0.5测试)。
simpleCart配置是相同的(我的拇指用于我的图像字段):
simpleCart({
checkout: {
type: "PayPal",
email: "you@yours.com" },
cartColumns: [
{view : function(item, column){
return "<img src='" + item.get('thumb') + "'>";},
attr : 'thumb'},
{ attr: "price" , label: "Price", view: 'currency' } ,
{ attr: "quantity" , label: "Qty" } ,
{ attr: "total" , label: "SubTotal", view: 'currency' } ,
{ view: "remove" , text: "Remove" , label: false } ],
cartStyle: "table"
});
这是不同的部分,因为它使用了我更喜欢的simpleCart add功能,并且无法找到其他任何地方的示例:
<li><img class="productimage" src="myproductimage.png" alt"myproductname" />
<span class="price">$10</span><b>MyProductName<br />
<a href="#" onclick="simpleCart.add({quantity:1,name:'myproductname',price:'10.00',thumb:'myproductimage.png'});return false;">add to cart</a></b></li>