html vs Json with knockout
<p>Im struggling with reading and displaying JSON collection data. I did go through different tutorials but not really sovled my issue.
    Here is the JSON Data I need to map and display using HTML. It's bit urgent, can some one send JS and html code. Attached is the java script code I tried.  I do not know how to write HTML code display all the data. Please help</p>

<pre><code>var data = {
  standards: [{
    category:'Desktop PCs',
    products:[
      {name:'22 inch Wide LCD Desktop Tst1',number:'NK571AA#DESK1',price:'209.00'},
      {name:'22 inch Wide LCD Desktop Tst2',number:'NK571AA#DESK2',price:'210.00'},
      {name:'22 inch Wide LCD Desktop Tst3',number:'NK571AA#DESK3',price:'211.00'}
    ]
  }, {
    category:'Laptops',
    products:[
      {name:'22 inch Wide LCD Laptop Tst1',number:'NK571AALPT1',price:'212.00'},
      {name:'22 inch Wide LCD Laptop Tst2',number:'NK571AALPT2',price:'213.00'},
      {name:'22 inch Wide LCD Laptop Tst3',number:'NK571AALPT3',price:'214.00'}
    ]
  }, {
    category:'Network Cables',
    products:[
      {name:'22 inch Wide LCD NtwkCble Tst1',number:'NK571AA#NTW1',price:'215.00'},
      {name:'22 inch Wide LCD NtwkCble Tst2',number:'NK571AA#NTW2',price:'216.00'},
      {name:'22 inch Wide LCD NtwkCble Tst3',number:'NK571AA#NTW3',price:'217.00'}
    ]
  }]
};
</code></pre>

<p>Here is the bad KO JS I wrote which is not working. and also I desperately need HTML code to display this data.</p>

<pre><code>var StandardViewModel = function(data){
    alert("StandardViewModelTest1...);
    this.name = ko.observable();
          //this.category= ko.observable();
    this.$type = 'StandardViewModel ';
    ko.mapping.fromJS(data, mapping, this);
}

var ProductViewModel = function(data){
    this.name = ko.observable();
    //this.number= ko.observable();
    //this.price = ko.observable();
    this.$type = 'ProductViewModel ';
    ko.mapping.fromJS(data, mapping, this);
}

var mapping = {
    'products': {
        create: function(options) {
            return new ProductViewModel (options.data);
        }
    }
}

var data = { standards: [{category:'Desktop PCs', products:[{name:'22 inch Wide LCD Desktop Tst1',number:'NK571AA#DESK1',price:'209.00'},{name:'22 inch Wide LCD Desktop Tst2',number:'NK571AA#DESK2',price:'210.00'},{name:'22 inch Wide LCD Desktop Tst3',number:'NK571AA#DESK3',price:'211.00'}]},
                         {category:'Laptops', products:[{name:'22 inch Wide LCD Laptop Tst1',number:'NK571AALPT1',price:'212.00'},{name:'22 inch Wide LCD Laptop Tst2',number:'NK571AALPT2',price:'213.00'},{name:'22 inch Wide LCD Laptop Tst3',number:'NK571AALPT3',price:'214.00'}]},
                         {category:'Network Cables', products:[{name:'22 inch Wide LCD NtwkCble Tst1',number:'NK571AA#NTW1',price:'215.00'},{name:'22 inch Wide LCD NtwkCble Tst2',number:'NK571AA#NTW2',price:'216.00'},{name:'22 inch Wide LCD NtwkCble Tst3',number:'NK571AA#NTW3',price:'217.00'}]}
                        ]};

var VM = new StandardViewModel(data.standards);

console.log(vm);
console.log(vm.$type);
console.log(vm.products());
console.log(vm.products()[0].$type);
</code></pre>
