Issue with my Knockout JS Mapping code

[wongadob]

I have a globally defined view model as such which reads a JSON object from local storage (That bit works or at least did until I transitioned to Knockout mapping

var gds = new gdStructure();if (localStorage.getItem("globalData")!== null){    gds=ko.mapping.fromJSON(localStorage.getItem("globalData"));}else{    // do a load of data automatically}function gdStructure(){    this.currentFamily = 0;    this.currentSeries = 0;    this.currentProduct = 0;    this.productInfoMain = new Object();    this.family = new Object();    this.series = new Object();    this.product = new Object();   }

I then Load a JSON file, set productInfoMain with the new data and re-map to Knockout. In the following way

$(document).ready(function(){	    $.ajax({		    type: "GET",		    url: "JSON/productInfoMain.json",		    dataType: "JSON",		    success: function(feed) {			    console.log("feed",feed);			    ko.mapping.fromJSON(feed,gds.productInfoMain);			    ko.applyBindings(gds);		    }	    });});

Where I log the feed it is as it should be so I know the file has loaded. I am currently getting this error message -

Uncaught TypeError: Cannot read property '__ko_mapping__' of undefined

I have been banging my head with this for about 4 hours now and just cannot get it to work. I access the data in HTML as such (that may have been previous error)

<h1 id="pageHeader" data-bind = "text: productInfoMain().overview.title()"></h1><h3 id = "subtitle" data-bind = "text: productInfoMain.overview.subtitle"></h3>

The JSON file structure is as follows (with extra data hacked out for clarity there was another section after "overview" on the same level) :-

{    "header": {	    "title": "Product Information",	    "description": "Full Product Information for XXXXXXX",	    "language": "en-us",	    "pubDate": "Tue, 10 Apr 2012 04:00:00 GMT"	    },    "overview": {	    "title":"The title of the page",	    "subtitle": "blah blah subtitle",	    "mainDescription": "blah blah"	    },}

If anybody can see where I am going wrong , it would be much appreciated!

[wongadob]

By the way the reason there are two different ways of accessing the data in the HTML is because I was initially thinking that is where the issue was as I was getting a blank screen. So was trying all sorts of combinations of accessing the model.

[justsomeguy]

That error message sounds like the ko object isn't defined. If you want to figure out exactly where the error is happening then you can set your browser's developer tools to break on all errors and highlight the line which caused the error so that you can check all the variables and things that are defined at that point.