Is there any way to make force:navigateToSObject event to open sObject in new tab?
3 Answers
Yes, You can navigate to new tab using-
<aura:handler event="force:navigateToSObject" action="{!c.navigateToRecord}"/>
navigateToRecord : function(component , event, helper){
window.open('/' + event.getParam('recordId'));
},
-
-
-
You fire it and catch it in the same component. Probably be a good idea to cancel the event too Commented Jul 29, 2017 at 8:17
-
1I think you also need to add
'_blank'
as the second param towindow.open()
Commented Jul 29, 2017 at 8:19 -
I knew the record Id, so when I directly used window.open('/' +recordId) it works. So is it OK to skip the navigate standard event?– SarangCommented Jul 29, 2017 at 8:21
Since Salesforce suggests not using hard-coded or dynamic URLs, I would recommend using the more reliable lightning:navigation to open a new tab in Salesforce. I struggled with solving this at first, so here is my working solution. Hope it helps.
.cmp file:
//include this anywhere in your .cmp file
<lightning:navigation aura:id="navService"/>
controller.js :
//call your method/action
onClick: function(cmp, event, helper){
var navService = cmp.find("navService");
var pageReference = {
"type": "standard__recordPage", //example for opening a record page, see bottom for other supported types
"attributes": {
"recordId": recordId, //place your record id here that you wish to open
"actionName": "view"
}
}
navService.generateUrl(pageReference)
.then($A.getCallback(function(url) {
console.log('success: ' + url); //you can also set the url to an aura attribute if you wish
window.open(url,'_blank'); //this opens your page in a seperate tab here
}),
$A.getCallback(function(error) {
console.log('error: ' + error);
}));
}
According to the docs, pageReference supports opening:
- Lightning Component (must implement lightning:isUrlAddressable)
- Knowledge Article
- Login Page
- Named Page
- Navigation Item
- Page Object
- Page Record
- Page Record
- Relationship Page
- Web Page
In case someone has problem with redirection to Process Instance Step, this worked for me
const navService = component.find("navService");
const processInstanceStepReference = {
type: 'standard__recordPage',
attributes: {
recordId: processInstanceStep.Id,
objectApiName: 'ProcessInstanceStep',
actionName: 'view'
}
};
const url = navService.generateUrl(processInstanceStepReference);
navService.generateUrl(processInstanceStepReference)
window.location.replace(url);
This prevents opening Process Instance Step as subtab for Process Instance Work Item.