将未知输入绑定到viewmodel

Question

http://jsfiddle.net/GfxxY/2/

var ProductOptions = function(data){
    data = data || {};
    SKU = ko.observable(data.SKU || ''),
    SizeName = ko.observable(data.SizeName || ''),
    SizeLetter = ko.observable(data.SizeLetter || ''),    
    ColorName = ko.observable(data.ColorName || ''),      
    ColorSwatchImage = ko.observable(data.ColorSwatchImage || ''),
    ColorImage = ko.observable(data.ColorImage || '')
    return{
        SKU: SKU, 
        SizeName: SizeName, 
        SizeLetter: SizeLetter,
        ColorName: ColorName,
        ColorSwatchImage: ColorSwatchImage,
        ColorImage: ColorImage
    };
};

在我的产品页面上，我说，T恤＃4343。这款T恤有2种颜色，每种颜色都有不同的尺码。

我陷入困境，我想要完成的是我需要能够选择T恤颜色，让客户输入尺寸/数量的值，然后动态生成报价并添加该颜色/大小/数量信息到新数组然后让他们改变/删除它。

所以我的最终结果是：

T恤选项

红色 - ＆gt;小号中号大号 蓝色 - ＆gt;中，X大，2倍大

已添加商品

Red  --> Small     -> 4     --$43.43
         Medium    -> 134   --$234.34
         Large     ->  343  --$8743.11


Blue  --> Small     -> 4     --$43.43
          X-Large   -> 134   --$234.34
          2-xLarge  ->  343  --$8743.11

我坚持如何使用Knockout实现这一目标。帮助会很棒。

编辑： 不知道如何标记为完整或不是什么，但Origineil给了我我想要的。谢谢你！