I have a lwc data-table which is to display the list of records retrieved from APEX Imperative callout. The table displays the data when the number of records retrieved is only 1. However when the number of records retrieved is more than 1 then the table is blank.
My Data Table is:
<div style="height:auto; width:auto">
<lightning-datatable
key-field="id"
data={srvoutput}
columns={outputcolumns}
column-width-mode="fixed"
hide-checkbox-column="true"
>
</lightning-datatable>
</div>
My JS Code is:
const inputcol = [
{ label: 'Location', fieldName: 'Location', type: 'text', initialwidth: 100},
{ label: 'Required', fieldName: 'Required', type: 'text', initialwidth: 100},
{ label: 'DataType', fieldName: 'DataType', type: 'text', initialwidth: 150},
{ label: 'Parameter Name', fieldName: 'ParameterName', type: 'text', initialwidth: 100 },
{ label: 'Name', fieldName: 'Name', type: 'text', initialwidth: 100},
{ label: 'Description', fieldName: 'Description', type: 'text', wrapText: true, initialwidth: 450 },
{ label: 'Resource Name', fieldName: 'ResourceName', type: 'text', initialwidth: 100},
];
export default class DetailedTiles extends LightningElement {
@track srvinput = [];
@track showtable = false;
//APEX Imperative Callout - triggered by another event
apexmethod({param1: value1, param2:value2})
.then(result=>{
this.srvinput = result;
this.showtable = true;
}
Unable to figure out the inconsistent behaviour. Appreciate help.
srvoutput
, JS and html code are different.