3

Using Knockout with slickgrid I can get the addition of a row to function correctly, but I can't get individual property editing to work. It throws this error:

Uncaught TypeError: Property 'ProductName' of object #<Product> is not a function

So it has to do with my bindingHandler because i'm using observables on my object properties i could only get the correct values to display if i unwrapped and re-valued the data:

 var data = ko.utils.unwrapObservable(settings.data);
    $.each(data, function(index, item) {
        var prop;

        for (prop in item) {
            if (item.hasOwnProperty(prop)) {
                data[index][prop] = ko.utils.unwrapObservable(data[index][prop]);
            }
        }

    });

    var columns = ko.utils.unwrapObservable(settings.columns);
    var options = ko.utils.unwrapObservable(settings.options) || {};
    grid = new Slick.Grid(element, data, columns, options);

And the edit function lies on my viewModel:

function ViewModel(data) {
var self = this;

self.gridData = ko.observableArray(data);
self.columns = [
    {
    name: 'Product ID',
    id: 'ProductId',
    field: 'ProductId'},
{
    name: 'Color',
    id: 'ColorName',
    field: 'ColorName'},
{
    name: 'Sku',
    id: 'Sku',
    field: 'Sku'},
{
    name: 'Product Name',
    id: 'ProductName',
    field: 'ProductName'}
];


self.fnTestClickEdit = function() {
    self.gridData()[0].ProductName("Product has been Edited " + new Date());
};

}

But seeing as how I'm at a dead end with this, am I doing something blatantly wrong in my implementation here?

Here is a jsFiddle of it all put together:

http://jsfiddle.net/sbrqB/3/

james
  • 408
  • 7
  • 22
  • I was able to get this working but its not a true observable property on my object. I'm having to replace the object in the array, and while the observable array is tracking its updates - i still have yet to figure out why the property will not. New fiddle: http://jsfiddle.net/sbrqB/8/ – james Jul 30 '12 at 14:04

1 Answers1

0

You might checkout KoGrid

According to their page:

KoGrid came out of our need for a decent datagrid that was built for MVVM/Knockout-style development. It draws considerable inspiration and architecture from SlickGrid, but is still KO throughout.

I haven't tried it (and the project is still labeled alpha), but I imagine it would be much easier to integrate it into your KO application.

bmode
  • 760
  • 6
  • 9