asp.net core e-commerce product variations UI

Question

I have decided to make an e-commerce site in asp.net core, and I haven't gotten very far, I'm still trying to hammer out the product details and I'm stuck when it comes to product variations / attributes that change the price, and how I would allow the user to create these variations without them totally recreating the product.

This question is similar but doesn't answer my question because it doesn't show price variation or how you would allow a user to add these things when creating a product: How to show product variation in detail page in ASP.NET So far I have this for my product model:

    public class Product
{
    [Key]
    public Guid Id { get; set; }

    [ForeignKey("Brand")]
    public Guid? BrandId { get; set; }
    public Brand Brand { get; set; }

    public string Name { get; set; }
    public ICollection<ProductCategory> Categories { get; set; }

    [Column(TypeName = "money")]
    public decimal BaseCost { get; set; }
    public ICollection<ProductAttribute> ProductAttributes { get; set; }

    public Guid TaxTypeId { get; set; }
    public TaxType TaxType { get; set; }

    public double? Weight { get; set; }

    public decimal? ProductHeight { get; set; }
    public decimal? ProductWidth { get; set; }
    public decimal? ProductDepth { get; set; }

    public string MainImageUrl { get; set; }
    public string MainThumbnailUrl { get; set; }

    public ICollection<ProductGalleryImage> ProductGalleryImages { get; set; }
} 

and this for my attributes

public class ProductAttribute
{
    public Guid Id { get; set; }
    public string Name { get; set; }
    public ICollection<AttributeValue> Values { get; set; }
}
public class AttributeValue
{
    public string Name { get; set; }
    public decimal Cost { get; set; }
}

As you can see every attribute has a name and a collection of "values" each "value" also has a name, and a cost as well. This is to allow for things like: Generic Shoe - size 10, £50 || size 5 £25

If these were common set values (Size, Colour) that didn't add/change a price, I would probably just have the user create them seperately from a product(in fact that will probably still be an option), and just use a tokenfield or something to add the attribute during product creation.

I've looked around and not been able to find the best way of doing this, it all seemed straight forward until I tried to make it work! If the price wasn't changed by the variation I'd be laughing (probably stuck elsewhere!). Maybe I can have the user make the product and then redirect to a form to add attributes / variations one at a time via ajax!? What are peoples thoughts on this, what would be the best way of getting this done? If someone could get me started or point me in the direction it would be appreciated! Right now it's 2:20am so I'm going to bed lol, another late night banging my head on my desk!

Answer 1

Mark,

You are correct, things get really difficult when you start looking at product attributes that may or may not change the cost of the product. I have worked on many ecommerce solutions and we have always found the best way to do this was the user creates a product with the standard definitions.

Then after they can add attributes attached to the product. This is usually done in a grid with AJAX models, posts etc. The concept is pretty much as you have listed above is the way we usually do it.

For the attributes we allow the user to create an attribute (that is not bound to a product) ie Size, Color etc. Then they can add that attribute to the product and provide the values that are available for that product specifically. This allows them to reuse the same attributes but provide different values on each product.

Now this goes even further as it may or may not affect the price but may also affect the stock levels for product. Say you have 10 Size 5 shoes in Pink but only 2 Size 5 shoes in Blue.

I realise this doesn't tell you how to do it directly but gives you an idea of how to achieve this.

Now there is a really good open source reference. Checkout NopCommerce product attributes and attribute combinations.

• Product Attributes
• Adding Attributes to Products

Disclaimer. I do not work for NopCommerce but have done alot of work with that platform.