3

I am developing a Lightning component that lists related Contacts. I would like to make it so that when you click on the name of a related contact, then it will navigate to that contact's record. Here is the component:

<aura:component implements="force:appHostable">
     <aura:attribute name="RelatedContact" type="Contact"/>
     <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
     <ui:outputText value="{!v.RelatedContact.Name}" click="{!goToContact}"/>
 </aura:component>

In my controller I have the method goToContact as follows

goToContact : function(component, event, helper) {
    sforce.one.navigateToSObject(component.get("v.RelatedContact.Id"));
}

and the method doInit as follows

doInit : function(component, event, helper){
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');  
    script.src = "/soap/ajax/32.0/connection.js"; 
    script.type = 'text/javascript';
    script.key = "/soap/ajax/32.0/connection.js"; 
    script.helper = this;
    script.id = "script_" + component.getGlobalId();
    head.appendChild(script);

    var script2 = document.createElement('script');
    script2.src = "/soap/ajax/32.0/apex.js"; 
    script2.type = 'text/javascript';
    script2.key = "/soap/ajax/32.0/apex.js"; 
    script2.helper = this;
    script2.id = "script2_" + component.getGlobalId();
    head.appendChild(script2);
},

Everything appears to load properly, however, when I click on the name a pop up gives me this message

Something has gone wrong. Cannot read property 'navigateToSObject' of undefined. Please try again.

2

You will need to fire the event .Lightning is Event driven and different than visualforce .

Use the below event

goToContact : function (component, event, helper) {
 var navEvt = $A.get("e.force:navigateToSObject");
   navEvt.setParams({
     "recordId": component.get("v.RelatedContact.Id"),
     "slideDevName": "related"
   });
   navEvt.fire();
}

Also to fetch all contacts I would use an AuraEnabled apex class to feed the data to the Front end and not use ajax call as you did .

  • 2
    I had an issue with the navEvt being null. However, this worked when I added <aura:dependency resource="markup://force:navigateToSObject" type="EVENT"/> to the component. – Louis Pujol Apr 15 '16 at 18:12
  • I am still surprised why you needed to add the dependency here .It makes no sense here – Mohith Shrivastava Apr 15 '16 at 18:48
  • @LouisPujol thanks for the comment it was null for me as well.. not sure of the reason – Kaushik Ray May 3 '16 at 14:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.