Slickgrid Display Object in Single Column not Row - row

Question

I am trying to figure out how to use slickgrid to display my object in a single column and not in a single row. Below is an example. Ideas?
Grid data looks like this
[{ fname: 'john', lname:'doe'}, {fname:'kyle', lname:'noobie'}]
This is what I get with slickgrid (row object view)
desc | fname | lanme
option1 | john | doe
option2 | kyle | noobie
This is what I want (column object view)
desc | option1 | option2
fname | john | kyle
lname | doe | noobie

Answer 1

So I figured this out and it's not pretty. Basically I have to pivot the data into a new row objects and then unpivot it back out to save it. It's not really that pretty but it gets the job done. The crazy thing is now you have to create a single editor and formatter for and apply that to each column. The editor/formatter look at the field names and do switch statement to determine what it should look like. Have fun. I did. :)
function getPivotedRows(origData) {
//this is a mapping between the column headings and the properties
var properties = [{ 'First Name': 'fname' }, { 'Last Name': 'lname' }];
//this holds my pivoted rows
var rows = [];
for (var i = 0; i < properties.length; i++) {
var row = {};
for (var j = 0; j < origData.length; j++) {
var key = "";
for (var p in properties[i]) {
row['Description'] = p; //set the column
key = properties[i][p];
}
row['options' + (j + 1)] = origData[j][key];
}
row[gridOptions.uniqueKey] = i;
rows.push(row);
}
return rows;
}