SlickGrid: Simple example of using DataView rather than raw data?

Viewed 28260

I'm working with SlickGrid, binding data directly to the grid from an Ajax call. It's working well at the moment, the grid updates dynamically and is sortable, and I'm using a custom formatter for one column:

var grid;
var columns = [{
  id: "time",
  name: "Date",
  field: "time"
},
{
  id: "rating",
  name: "Rating",
  formatter: starFormatter // custom formatter 
}
];
var options = {
  enableColumnReorder: false,
  multiColumnSort: true
};
// When user clicks button, fetch data via Ajax, and bind it to the grid. 
$('#mybutton').click(function() {
  $.getJSON(my_url, function(data) {
    grid = new Slick.Grid("#myGrid", data, columns, options);
  });
});

However, I want to apply a class to rows in the grid based on the value of the data, so it appears I need to use a DataView instead. The DataView example on the SlickGrid wiki is rather complicated, and has all kinds of extra methods.

Please could someone explain how I simply convert data to a DataView - both initially and on Ajax reload - while leaving the grid sortable, and continuing to use my custom formatter? (I don't need to know how to apply the class, literally just how to use a DataView.)

I'm hoping it's one or two extra lines inside the .getJSON call, but I fear it may be more complicated than that.

3 Answers
Related