diff --git a/src/view-slickgrid.js b/src/view-slickgrid.js
index 6635e256..f42e905e 100644
--- a/src/view-slickgrid.js
+++ b/src/view-slickgrid.js
@@ -108,8 +108,15 @@ my.SlickGrid = Backbone.View.extend({
     }
     columns = columns.concat(tempHiddenColumns);
 
+    var data = [];
 
-    var data = this.model.currentDocuments.toJSON();
+    this.model.currentDocuments.each(function(doc){
+      var row = {};
+      self.model.fields.each(function(field){
+        row[field.id] = doc.getFieldValue(field);
+      });
+      data.push(row);
+    });
 
     this.grid = new Slick.Grid(this.el, data, visibleColumns, options);
 
diff --git a/test/view-slickgrid.test.js b/test/view-slickgrid.test.js
index d43d2d1b..56b5a457 100644
--- a/test/view-slickgrid.test.js
+++ b/test/view-slickgrid.test.js
@@ -42,7 +42,7 @@ test('state', function () {
   var visibleColumns = _.filter(_.pluck(dataset.fields.toArray(),'id'),function(f){
     return (_.indexOf(view.state.get('hiddenColumns'),f) == -1)
   });
-  
+
   // Hidden columns
   assertPresent('.slick-header-column[title="y"]');
   assertNotPresent('.slick-header-column[title="x"]');
@@ -61,4 +61,31 @@ test('state', function () {
   view.remove();
 });
 
+test('renderers', function () {
+  var dataset = Fixture.getDataset();
+
+  dataset.fields.get('country').renderer = function(val, field, doc){
+    return 'Country: ' + val;
+  };
+
+  var deriver = function(val, field, doc){
+    return doc.get('x') * 10;
+  }
+  dataset.fields.add(new recline.Model.Field({id:'computed'},{deriver:deriver}));
+
+
+  var view = new recline.View.SlickGrid({
+    model: dataset
+  });
+  $('.fixtures .test-datatable').append(view.el);
+  view.render();
+
+  // Render the grid manually
+  view.grid.init();
+
+  equal($(view.grid.getCellNode(0,view.grid.getColumnIndex('country'))).text(),'Country: DE');
+  equal($(view.grid.getCellNode(0,view.grid.getColumnIndex('computed'))).text(),'10');
+  view.remove();
+});
+
 })(this.jQuery);