Node: 12.13.0
Jet: 7.2.0
Scenario: Trying to fetch attribute of collection from selected table row. I have the selected.row attribute bound to an observable and the on-selection-changed attribute set to a method in my VM. When the method fires, I fetch they key from the selectedRows observable but I am struggling with how to query the collection for the key and fetch the attributes for the row. I have re-produced this with an emp/dept example to highlight.
When trying to use the 'get' method on the Model class I am receiving 'xx is not a function'.
Any help greatly appreciated.
HTML:
<oj-table id='table' aria-label='Employee Table' data='[[employeeDataSource]]'
selection-mode='{"row": "single", "column": "none"}' dnd='{"reorder": {"columns": "enabled"}}'
scroll-policy='loadMoreOnScroll' scroll-policy-options='{"fetchSize": 10}'
selected.row='{{selectedRows}}'
on-selected-changed='{{selectedChangedListener}}'
columns='[{"headerText": "Employee Id",
"field": "EmployeeId",
"headerClassName": "oj-sm-only-hide",
"className": "oj-sm-only-hide",
"resizable": "enabled"},
{"headerText": "First Name",
"field": "FirstName",
"resizable": "enabled"},
{"headerText": "Last Name",
"field": "LastName",
"headerClassName": "oj-sm-only-hide",
"className": "oj-sm-only-hide",
"resizable": "enabled"},
{"headerText": "Salary",
"field": "Salary",
"resizable": "enabled"}]' style='width: 100%; height: 200px;'>
</oj-table>
ViewMode:
function DashboardViewModel() {
self.selectedRows = new keySet.ObservableKeySet();
self.selectedRowsModel = ko.observable();
self.employeeDataSource = ko.observable();
self.employeeDataSourceURL = 'http://<host>/restapp/rest/1/Employees';
/* List View Collection and Model */
var employeeModelItem = oj.Model.extend({
idAttribute: 'EmployeeId'
});
self.employeeCollection = new oj.Collection.extend({
url: self.employeeDataSourceURL,
fetchSize: 25,
model: employeeModelItem,
oauth: new self.myBasicAuth()
});
self.employeeTable = ko.observable(new self.employeeCollection());
self.employeeDataSource(new oj.CollectionTableDataSource(self.employeeTable()));
self.selectedChangedListener = function(event)
{
var data = event.detail;
var selectionText = '';
var keys = '';
var fName = '';
if (event.type == 'selectedChanged')
{
if(self.selectedRows() != null && self.selectedRows().values().size > 0){
self.selectedRows().values().forEach(function(key)
{
console.log("Selected Key: " + key);
// Attempt 1
var emp = self.employeeTable().get(key);
// Error: Raises emp is not a function
fName = emp().get('FirstName');
// Attempt 2
self.selectedRowsModel(self.employeeTable().get(key));
// self.selectedRowsModel(...).get is not a function
fname = self.selectedRowsModel().get('EmployeeId');
});
}
}
}
return new DashboardViewModel();
}