title: JSON - cannot read property length of undefined
body: <p>I'm trying to make a kendo panelbar with a kendo datasource. I'm getting a 'cannot read property length of undefined' in the jquery.min.js file on this line <code>var panelBar = $("#foodGroups").kendoPanelBar({dataSource: ds }).data("kendoPanelBar");</code>. I think it is because of my datasource. Here is an example of a kendo datasource format <a href="http://jsfiddle.net/MMRCf/8/light/" rel="nofollow">example</a>. Is my datasource data not in the correct format? Code:</p>
  
  <pre><code>function populateFoodGroups() {
  
  var ds = new kendo.data.DataSource({});
  
        var pData = [];    
  if (_theFoodGroups.length &gt; 0) {
          var groups = [];
          for(var y = 0; y &lt; _selectedMealType.allMealFoodGroup.Code.length; y ++) {
              pData.push({text:_selectedMealType.allMealFoodGroup.Code[y].description,
                          contentUrl: 'file:///data/data/VCare.International.Observations/files/12590FAA-5EDD-4B12-856D-F52A0A1599F2/Views/Phone/checkboxes.html'});
  
  
  
              if($.inArray(_selectedMealType.allMealFoodGroup.Code[y].myMealFoodGroup.description, groups) === -1){
  
                  groups.push({text: _selectedMealType.allMealFoodGroup.Code[y].myMealFoodGroup.description, content: pData[y]});
              }
          }
  
  
  
          for(var z = 0; z &lt; groups.length; z ++) {
              //panelBar.append({text: groups[z].text, items: pData[z]});
              ds.add({text: groups[z].text, items: groups[z].content});
          }
  
     var panelBar = $("#foodGroups").kendoPanelBar({dataSource: ds }).data("kendoPanelBar");
  
  }
  }
  </code></pre>