When working with Salesforce, efficiently finding and selecting records is crucial for maintaining productivity. The lightning-record-picker component is a powerful tool that allows you to search for a list of Salesforce records that match your search input. It leverages the GraphQL wire adapter to search for records, displays the results, and enables you to select a record seamlessly.

What is the lightning-record-picker Component?

The lightning-record-picker component is designed to simplify the process of searching and selecting records in Salesforce. Whether you’re searching for accounts, contacts, opportunities, or any other object, this component provides an intuitive interface for users to quickly find the records they need.

Creating a Basic Record Picker

Here’s a basic example that demonstrates how to create a record picker component that searches for Account objects:

<template>
  <lightning-card title="Lightning Record Picker">
    <div class="slds-m-around_medium">
      <lightning-record-picker label="Accounts" placeholder="Search Accounts..." 
      object-api-name="Account">
      </lightning-record-picker>
    </div>
  </lightning-card>
</template>

In this example, the label attribute sets the label for the component, the placeholder attribute sets the placeholder text for the search input, and the object-api-name specifies the type of records to search for.

Specifying a Filter

One of the powerful features of the lightning-record-picker component is the ability to filter the records that are listed. The filter attribute allows you to specify which records should be displayed based on certain criteria.

The value for the filter attribute is an object with a criteria property and an optional filterLogic property. The criteria property is an array that lists the filter criteria objects.

Example: Filtering Account Records

Let’s look at an example where we filter Account records based on the following conditions:

• The Website field equals “https://www.grenoble.fr” or is null.
• The Name of the related Parent does not start with “Acme”.
• The Type is not equal to “Partner”.

Here’s how you can define this filter:

import { LightningElement } from 'lwc';
export default class LightningRecordPicker extends LightningElement {
    filter = {
    criteria: [
        {
            fieldPath: 'Website',
            operator: 'eq',
            value: 'https://www.grenoble.fr',
        },
        {
            fieldPath: 'Website',
            operator: 'eq',
            value: null,
        },
        {
            fieldPath: 'Type',
            operator: 'ne',
            value: 'Partner',
        },
        {
            fieldPath: 'Parent.Name',
            operator: 'like',
            value: 'Acme%',
        },
    ],
    filterLogic: '(1 OR 2) AND NOT(4) AND 3',
};

}

In this filter object, criteria is an array of filter criteria, and filterLogic defines how these criteria should be combined. The filterLogic follows the format where numbers correspond to the index of the criteria in the array.

Here’s how to use this filter in the lightning-record-picker component:

<template>
  <lightning-card title="Lightning Record Picker">
    <div class="slds-m-around_medium">
      <lightning-record-picker label="Accounts" filter={filter} object-api-name="Account">
      </lightning-record-picker>
    </div>
  </lightning-card>
</template>

Conclusion

The lightning-record-picker component is a versatile and powerful tool for Salesforce developers. By using this component, you can provide users with an efficient and user-friendly way to search for and select records. Whether you need a simple search or complex filtering, the lightning-record-picker component has you covered.

Happy coding!