Skip to Main Content

DevOps, CI/CD and Automation

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

How to Fetch Attribute of Collection using Key

DaveArchNov 11 2019 — edited Nov 11 2019

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();

     

     }

This post has been answered by Duncan Mills-Oracle on Nov 11 2019
Jump to Answer

Comments

Post Details

Added on Nov 11 2019
10 comments
284 views