You need to sign in to do that
Don't have an account?
Katie Kourtakis
Navigation in LWC not Working
Hello,
I am trying to navigate to a record page when a button is clicked. I receive an error each time saying the page does not exist and to enter a valid url and try again. I tried navigating to a webpage to see if that would work and it did. Based on code examples and documentation I've seen I can't figure out why navigating to a record page is not working properly.
Some context: My LWC sits on the campaign object and creates a button for each volunteer job that is connected to the campaign. Right now I am just trying to get the button to go to one of the volunteer job record pages. Once I know the navigation works I am going to try and fill the recordId attribute with the recordId associated with each button to direct to the correct volunteer job.
HTML:
JS
Thanks!
Katie
I am trying to navigate to a record page when a button is clicked. I receive an error each time saying the page does not exist and to enter a valid url and try again. I tried navigating to a webpage to see if that would work and it did. Based on code examples and documentation I've seen I can't figure out why navigating to a record page is not working properly.
Some context: My LWC sits on the campaign object and creates a button for each volunteer job that is connected to the campaign. Right now I am just trying to get the button to go to one of the volunteer job record pages. Once I know the navigation works I am going to try and fill the recordId attribute with the recordId associated with each button to direct to the correct volunteer job.
HTML:
<template> <lightning-card title="Program Navigation" record-id={recordId}> <ul class="slds-button-group-row slds-align_absolute-center"> <template for:each={data} for:item="program"> <li key={program.Id} class="slds-button-group-item"> <button class="slds-button slds-button_brand" onclick={navigateToVolunteerJob}> {program.Name}</button> </li> </template> </ul> </lightning-card> </template>
JS
import { LightningElement, track, api, wire } from 'lwc'; import getPrograms from '@salesforce/apex/programButtonController.getPrograms'; import { NavigationMixin } from 'lightning/navigation'; export default class ProgramButtons extends NavigationMixin(LightningElement) { @track data = []; @api recordId; @wire(getPrograms, { recordId: '$recordId' }) wiredRecord(result) { if(result.data) { this.data = result.data; this.error = undefined; } else if (result.error) { this.error = 'Unknown error'; this.data = undefined; } } //Navigate to recordpage on click navigateToVolunteerJob() { this[NavigationMixin.Navigate]({ type: 'standard_recordPage', attributes: { recordId: 'a0T02000000GoISEA0', objectApiName: 'GW_Volunteers__Volunteer_Job__c', actionName: 'view' } }); } //test naviagting to webpage navigateToWebPage() { // Navigate to a URL this[NavigationMixin.Navigate]({ type: 'standard__webPage', attributes: { url: 'http://salesforce.com' } }, true // Replaces the current page in your browser history with the URL ); } }
Thanks!
Katie
Can you try hardcoding the URL and see if it works??
Regards,
Anutej
I just hardcoded the URL like so and it still came back with an error that the page does not exist. :(
Thanks,
Katie
I found the above in http://www.sfdcpanda.com/pagereference-record-page-navigation-lightning/
Do let me know if it works.
<span data-key={record.Id} data-name={record.Name} class="slds-listbox__option-text slds-listbox__option-text_entity">{record.Name} </span>
in Js function:
this.selectedRecordId = event.target.dataset.key;
And ObjectApiName is not mandatory as per the documentation. Remove object api name and try once.
check example: Navigate to Record Page Based On Record Id In LWC (https://www.salesforcepoint.com/2020/07/redirect-to-record-page-in-lwc-code.html)