ojtable is not rendering

indraraj26-Oracle

Hi Folks,

I can see data provider in browser console. Also i can print data using oj-bind-for-each but with same dataprovider oj-table is not rendering.

html:

  <style>
    .demo-table-container {
        width: 100%; 
        height: 27rem;
    }
   </style>
  <div id="componentDemoContent" style="width: 1px; min-width: 100%;">        
    <oj-table id='table' aria-label='Departments Table'
                                    data='[[dataprovider]]'
                                    selection-mode='{"row": "multiple", "column": "multiple"}'
                                    columns='[{"headerText": "Department Id", 
                                               "field": "DepartmentId",
                                               "headerClassName": "oj-sm-only-hide",
                                               "className": "oj-sm-only-hide",
                                               "resizable": "enabled"}
                                              ]'
                                    class='demo-table-container oj-bg-body'>
    </oj-table>
  </div>
  <oj-bind-for-each data="[[dataprovider]]">
    <template>
     <oj-bind-text value="[[$current.data.DepartmentId]]"></oj-bind-text>
    <template>
  </oj-bind-for-each>

js:

 this.deptArray = JSON.parse(deptData);
       this.dataprovider = new ArrayDataProvider(this.deptArray, {
             keyAttributes: "DepartmentId",
             implicitSort: [{ attribute: "DepartmentId", direction: "ascending" }],
         });
       console.log(this.dataprovider, 'data provider')

data:

[
    {
      "DepartmentId": 10,
      "DepartmentName": "Finance 9",
      "LocationId": 300,
      "ManagerId": 7001,
      "StartDate": "2014-06-13",
      "EmployeeCount": 335,
      "Type": "Sales",
      "Currency": "EUR",
      "Primary": [],
      "Rating": 3,
      "TargetComplete": 90
    },
    {
      "DepartmentId": 20,
      "DepartmentName": "Control And Credit 9",
      "LocationId": 300,
      "ManagerId": 7001,
      "StartDate": "2019-09-10",
      "EmployeeCount": 206,
      "Type": "HR",
      "Currency": "USD",
      "Primary": [],
      "Rating": 1,
      "TargetComplete": 90
    }
  ]

version:

ojet --version
Oracle JET Command Line Interface, version: 11.1.0

John 'JB' Brock-Oracle

Is the table not loading at all, or is the table loaded, but no data is showing?

If the table isn't showing at all, do you have the ojs/ojtable imported or included in the define blocks dependency array in your viewModel?

If the data isn't rendering, does the "data" that you show above, look like that before the JSON.parse method is called.

John 'JB' Brock-Oracle

Is the table not loading at all, or is the table loaded, but no data is showing?

If the table isn't showing at all, do you have the ojs/ojtable imported or included in the define blocks dependency array in your viewModel?

If the data isn't rendering, does the "data" that you show above, look like that before the JSON.parse method is called.

indraraj26-Oracle

Thank you @John 'JB' Brock-Oracle .

Yes i forgot to inject "ojs/ojtable". I think Cli should throw an warning/error in console dashboard.html is trying to load oj-table but looks like you forget to define/inject ojs/table.

#solved