0

I am working on an assignment in which the URL will contain the phone number of the contact. My lightning component has to parse the phone number from URL, perform a SOQL against contact. In case if there are multiple contacts available for the phone number, the contacts need to be displayed as list with first name+last name as a link. When we click on the first name + last name link, the control should go to the contact view/edit page. I got this working correctly with an OnClick method and with a event handler (I am not using the one.app container). If there is only one contact for the supplied phone number, the control should directly go to the contact view/edit page and should not show the list. In other words, we should not show a list for one contact where the user needs to click on the first name+last name. Any suggestions?

I am not using any standalone app also. I have a custom lightning tab which is associated the lightning component.

Below is my code (I stripped off some less important code).

Component:

<aura:component controller='RPCMembersLightningController' implements='force:appHostable'>
<lightning:workspaceAPI aura:id='workspace' />
<aura:attribute name="phoneNumber" type="string" />
<aura:attribute name="contactList" type="Contact[]" />
<aura:attribute name="contactListSize" type="Integer" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:handler event="force:navigateToSObject" action="{!c.navigateToRecord}"/>
<aura:if isTrue="{!v.contactListSize > 1}">
    <div class="slds-container_fluid">
        <div class="slds-grid">
            <div  class="slds-p-right_medium slds-p-left_medium slds-p-top_xx-small">
                <div id="list" class="row" >
                    <div class="slds-container_fluid" >
                        <h1 class="slds-align--absolute-center"><b>List of Contacts</b></h1>
                    </div>
                    <div class="slds-box">        
                        <table class="slds-table slds-table--bordered slds-table--cell-buffer slds-table--striped" >
                            <thead>
                                <tr class="slds-text-title--caps" >
                                    <th scope="col">
                                        <div class="slds-truncate">
                                            Name
                                        </div>
                                    </th>
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                <aura:iteration items="{!v.contactList}" var="con" indexVar="index">
                                    <tr>
                                        <td>
                                            <!--<ui:outputURL click="{!c.viewRecord}" label="{!con.FirstName + ' ' + con.LastName + ' ' + con.Suffix}" /> -->
                                            <a onclick="{!c.viewRecord}" style="width:100%;" data-index="{!index}">{!con.FirstName + ' ' + con.LastName + ' ' + con.Suffix}</a>
                                            <span></span>
                                        </td>
                                    </tr>
                                </aura:iteration>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <aura:set attribute="else">
        Size of the ContactList is in ELSE {!v.contactListSize}
        window.location.href = 'one/one.app#/sObject/'+contactList[0].Id+'/view';
    </aura:set>
</aura:if>
</aura:component>

================================================================================

JS Controller:

({
doInit : function(component, event, helper) {
    //Get the phone number from the URL Query String
    var value = helper.getParameterByName(component, event, "phoneNumber");
    //Set the Phone Number attribute
    component.set("v.phoneNumber",value);
    //alert('Phone Number from URL = ' + value);
    helper.getContactRecords(component, event, helper);
},
viewRecord : function(component, event, helper) {
    var navEvent = $A.get("e.force:navigateToSObject");
    var idx = event.target.getAttribute('data-index');
    var contact = component.get("v.contactList")[idx];
    console.log(contact);
    if(navEvent){
        navEvent.setParams({
             recordId: contact.Id,
             slideDevName: "detail"
        });
        navEvent.fire(); 
    }
},
navigateToRecord : function(component, event, helper) {
    var recordId = event.getParam("recordId");
    window.location.href = '/one/one.app#/sObject/'+recordId+'/view';
}
})

================================================================================

JS Helper:

({
    getParameterByName : function(component, event, name) {
        name = name.replace(/[\[\]]/g, "\\$&");
        var url = window.location.href;
        var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)");
        var results = regex.exec(url);
        if (!results) return null;
        if (!results[2]) return '';
        return decodeURIComponent(results[2].replace(/\+/g, " "));
},
getContactRecords : function(component, event, helper) {
    var action = component.get("c.getContacts");
    var phone = component.get("v.phoneNumber");
    action.setParams({
        "phoneNumber": phone
    });
    console.log(phone);
    action.setCallback(this, function(response) {
       var state = response.getState();
        var result = JSON.stringify(response.getReturnValue());
        console.log('contactList = ' + result);
        if (component.isValid() && state === "SUCCESS")
            component.set("v.contactList",response.getReturnValue());
            component.set("v.contactListSize", response.getReturnValue().length);
    });
    $A.enqueueAction(action);
}

})

Apex Controller:

public with sharing class RPCMembersLightningController {

@AuraEnabled
public static List<Contact> getContacts(String phoneNumber) {
    if (phoneNumber != null && phoneNumber != '') {
        string dashedPhoneNumber = phoneNumber.substring(0,3) + '-' + phoneNumber.substring(3,6) + '-' + phoneNumber.substring(6,10);
        string usPhoneNumber = '('+ phoneNumber.substring(0,3) +') ' + phoneNumber.substring(3,6) + '-' + phoneNumber.substring(6,10);
        List<Contact> contactList = [Select Id, 
                                        FirstName, 
                                        LastName
                                     from Contact 
                                     where RecordType.Name = 'Participant' and 
                                     (HomePhone = :phoneNumber or HomePhone = :dashedPhoneNumber or HomePhone = :usPhoneNumber
                                     OR
                                     MobilePhone = :phoneNumber or MobilePhone = :dashedPhoneNumber or MobilePhone = :usPhoneNumber)];
        System.debug('ContactList = ' + contactList);                                                                                                                                                                           
        return contactList;                            
    }
    else {
        return null;
    }                                                                                                                                                             
}

}

================================================================================

I am trying to find out how to automatically navigate to the Contact view/edit page in the <aura:set attribute="else"> section in the lightning component RPCMemberSearch.cmp. Please help.

Your Answer

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

Browse other questions tagged or ask your own question.