You need to sign in to do that
Don't have an account?
Som_11
How to create a Lightining Datatable which will take data and columns as input in LWC
Hi All, I am new to LWC.
I want to achieve, creating a Lightining Datatable which will take data and columns as input in LWC.
Will request to help in this.
I want to achieve, creating a Lightining Datatable which will take data and columns as input in LWC.
Will request to help in this.
You can take reference from below link:
https://blog.salesforcecasts.com/data-tables-lwc/
Thanks!
controller:
public with sharing class ContactController {
@AuraEnabled(cacheable=true)
public static List<Contact> getContacts() {
// The following line is used only for the last challenge
throw new AuraHandledException('Forced error');
return [SELECT FirstName, LastName, Email FROM Contact WITH SECURITY_ENFORCED ORDER BY LastName, FirstName];
}
}
html:
<template>
<lightning-card>
<template if:true={contacts.data}>
<lightning-datatable key-field="Id" data={contacts.data} columns={columns}> </lightning-datatable>
</template>
<template if:true={errors}>
<p>{errors}</p>
</template>
</lightning-card>
</template>
js:
import { LightningElement, wire } from "lwc";
import { reduceErrors } from "c/ldsUtils";
import FIRST_NAME_FIELD from "@salesforce/schema/Contact.FirstName";
import LAST_NAME_FIELD from "@salesforce/schema/Contact.LastName";
import EMAIL_FIELD from "@salesforce/schema/Contact.Email";
import getContacts from "@salesforce/apex/ContactController.getContacts";
const COLUMNS= [
{
label: "First Name",
fieldName: FIRST_NAME_FIELD.fieldApiName,
type: "text"
},
{
label: "Last Name",
fieldName: LAST_NAME_FIELD.fieldApiName,
type: "text"
},
{ label: "Email", fieldName: EMAIL_FIELD.fieldApiName, type: "email" }
];
export default class ContactList extends LightningElement {
columns = COLUMNS;
@wire(getContacts)
contacts;
get errors() {
return this.accounts.error ? reduceErrors(this.accounts.error) : [];
}
}
metaxml:
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>48.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__AppPage</target>
</targets>
</LightningComponentBundle>