How To Develop A Custom Record Picker For Salesforce LWR Sites
4.9 out of 5 based on 13456 votesLast updated on 28th Jan 2026 29.5K Views
- Bookmark
LWR sites are designed for speed and public access, many standard Salesforce components, including some record selection tools are not supported.
Lightning Web Runtime, often called LWR, has changed how Salesforce developers build fast. It focuses on performance and flexibility, especially for public-facing sites with lightweight applications. One common requirement while working with LWR sites is allowing users to search with selecting Salesforce records. Since standard components are limited in LWR, developers build a custom record picker.
Learners starting with a Salesforce Course Online usually understand basic Lightning Web Components initially. As they move forward, they realise that real projects require custom solutions with building user-friendly interfaces.
Why Do LWR Sites Need Custom Record Pickers?
LWR sites are designed for speed and public access, many standard Salesforce components, including some record selection tools are not supported.
Because of this, developers must create custom components that:
- Search records dynamically.
- Display matching results clearly.
- Allow record selection.
- Return selected values to the parent component.
This approach gives full control over performance and user experience.
Understanding the Use Case Before Coding
Before writing any code, it is important to understand what the record picker should do, for example:
- Should users search by name only or multiple fields?
- Should results appear as a dropdown or list?
- Is single selection enough or is multi-select required?
- Is the site public or authenticated?
During a Salesforce Certification Course, learners are trained to analyse requirements clearly before jumping into development. This habit saves time and avoids rework later.
Basic Architecture of a Custom Record Picker
A custom record picker usually has three main parts:
- A search input field
- A results container.
- An Apex controller to fetch records.
The Lightning Web Component handles user input and UI logic, while Apex securely fetches data from Salesforce.
This separation keeps the component clean and easier to maintain.
Creating the Apex Controller for Record Search
The Apex controller is responsible for querying records based on user input. It should be lightweight and secure, especially for LWR sites.
A basic Apex method:
- Accepts a search keyword
- Queries records using SOQL.
- Limits the number of results
- Returns only required fields.
Security is important here. Queries should respect sharing rules and avoid exposing sensitive fields.
Learners in a Salesforce Administrator Course often understand object structures and permissions well, which helps developers design safer queries.
Building the Lightning Web Component Structure
The LWC usually contains:
- An input element for search.
- A loop to display results.
- Event handlers for selection.
When users type into the input field, a JavaScript method calls the Apex function. The results are stored in a tracked variable and displayed dynamically.
The component should also handle:
- Empty input.
- No results found.
- Loading states.
These small details improve usability significantly.
Handling User Interaction and Selection
Once results are displayed, users should be able to click on a record. On selection:
- The selected record ID is stored.
- The record name is shown in the input.
- The result list is hidden.
The component can dispatch a custom event to notify the parent component about the selected record.
Developers learning through a Salesforce Developer Course practice these interaction patterns regularly because they are common across many real-world components.
Styling the Record Picker for LWR Sites
LWR sites rely heavily on CSS for clean layouts. Since SLDS support is limited, developers often write custom styles.
Good practices include:
- Keeping styles minimal.
- Making dropdowns responsive.
- Ensuring accessibility.
- Avoiding heavy animations.
Simple styling improves performance and keeps the site fast.
Making the Component Reusable
A good custom record picker should be reusable across different objects. This can be done by:
- Passing object API name as a parameter.
- Passing fields to search as attributes.
- Making result limits configurable.
Reusable components reduce development effort and are easier to maintain.
Students in Salesforce Training in Noida often work on reusable components as part of their project work helping them understand scalable design.
You May Also Read:
Salesforce Admin Resume with No Experience
Salesforce Lightning Experience
Marketing Cloud Work With Salesforce Course
Handling Performance and Governor Limits
Performance is critical for public LWR sites. Developers must:
- Avoid querying on every keystroke.
- Use debouncing techniques.
- Limit SOQL queries.
- Cache results when possible.
These techniques ensure the component remains responsive even under load.
Such performance considerations are discussed deeply during Salesforce Training in Delhi, where learners move beyond basic components and focus on real deployment scenarios.
Security Considerations for Public Sites
For public LWR sites:
- Apex methods must be carefully exposed.
- Guest user permissions must be controlled.
- Input must be validated.
Developers should never assume user input is safe, all inputs should be handled defensively.
Testing the Custom Record Picker
Testing includes:
- Typing fast and slow input.
- Selecting and reselecting records.
- Checking behavior on mobile.
- Testing with large datasets.
Testing on different browsers is also recommended to ensure consistent behavior.
Learners attending Salesforce Training in Hyderabad often test their components in multiple environments to understand real-world constraints.
Common Mistakes Developers Make
Some frequent issues include:
- Querying too many fields.
- Ignoring empty input handling.
- Not clearing results properly.
- Hardcoding object names.
Avoiding these mistakes makes the component cleaner and more professional.
Related Courses:
When to Use Custom Record Pickers?
Custom record pickers are ideal when:
- Standard components are not supported.
- You need full UI control.
- Performance is critical.
- The site is public-facing.
For internal Lightning apps, standard components may still be suitable.
Conclusion
Building a custom record picker for Salesforce LWR sites is a practical and valuable skill, it teaches developers how to combine everything. By understanding requirements, and focusing on reusability and security, developers can create powerful solutions that work smoothly.
With consistent practice and real project exposure, learners move from basic components to confident Salesforce developers who can handle advanced LWR.
Subscribe For Free Demo
Free Demo for Corporate & Online Trainings.