0

I have a combobox populated with listviews from an object. If I select a listview, those records have to be shown in the table. But the records of a selected object are not being updated unless I select another listview. Then the previous selected values are being shown. If I want the values of second time selected listview I need to click again the first listview or another listview. Only then the second listview records are being shown.

import { LightningElement,wire,track,api} from 'lwc';
import { getListUi} from 'lightning/uiListApi';
import PRODUCT_OBJECT from '@salesforce/schema/Product2';

export default class ShowListView extends LightningElement {

@track allListViews;
@track Value;   

@wire(getListUi, {objectApiName: PRODUCT_OBJECT})
wiredlistView({error,data}) {
    if(data){
        this.allListViews = data.lists;
        var listViewData = [];
    for(var i=0;i<this.allListViews.length;i++){
        listViewData.push({"label" : this.allListViews[i].label, "value" : 
this.allListViews[i].apiName});
    }
    this.allListViews = listViewData;
    }else if(error){
        console.log('An error has occurred:');
        console.log(error);
    }
}

@wire(getListUi, {objectApiName: PRODUCT_OBJECT,listViewApiName: '$Value'})
lastView({error,data}){
    if (data) {
        this.sobjectResult = data.records.records;  
    } else if (error) {
        this.error = error;
    }
}
handleChange(event) {
    this.Value=event.detail.value;     
}
}

How do I achieve this?

<template>
<lightning-card title=" List View Example" icon-name="standard:action_list_component">
    <lightning-combobox
        name=""
        label="Picklist Value"
        value={Value}
        placeholder="Select a ListView"
        options={allListViews}
        onchange={handleChange}>
    </lightning-combobox>
    <p>Selected Value is: {Value}</p>
    
    <table class="slds-table slds-table_cell-buffer slds-table_bordered">
        <thead>
            <tr class="slds-line-height_reset">
                <th >
                    <div >Price Book</div>
                </th>
                <th>
                    <div >Product Name</div>
                </th>
                <th>
                    <div>Product Code</div>
                </th>
                <th>
                    <div>Product Family</div>
                </th>
            </tr>
        </thead>
        <tbody>
            <template if:true={sobjectResult}>
                <template for:each={sobjectResult} for:item="so">
                    <tr class="slds-hint-parent" key={so.id}>
                        <td >{so.id}</td>
                        <td > {so.fields.Name.value}</td>
                        <td > {so.fields.ProductCode.value}</td>
                        <td > {so.fields.Family.value}</td>
                    </tr>
                </template>
            </template>
            <template if:false={sobjectResult}>
                List View is not contains any data
            </template>
        </tbody>
    </table>
</lightning-card>

This is the template

  • Maybe a problem with your template. I tested your code and it seems working for me. can you share your template code? – Klecool Jul 14 '20 at 7:14
  • @Klecool. Updated in the body. – Nikhil Rayala Jul 14 '20 at 10:28
1

You did not declare the sobjectResult in your js and that was the cause of unexpected behavior. You just need to add it to your js.
Also, note since the Spring '20 Release, the @track decorator is no longer required.

export default class ShowListView extends LightningElement {

@track allListViews;
@track Value;
sobjectResult;
...
  • Thanks a lot. Working perfectly – Nikhil Rayala Jul 14 '20 at 11:12
  • You 're welcome! – Klecool Jul 14 '20 at 11:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.