2

Instead of Button. I want hyperlink for Month and year.If user click that button I want to open particular visual force page.

2.I want only 2 columns .each column should contains 3 row values


<aura:component  controller="SalaryController" implements="force:appHostable,force:lightningQuickAction,flexipage:availableForRecordHome,flexipage:availableForAllPageTypes,force:hasRecordId" access="global">
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:attribute name="payDetail" type="Salary_Slips__c[]"/>
<aura:attribute name="name" type="Salary_Slips__c[]"/>
<center> <b>View Salary slip</b></center>

<table>
    <tr>
        <th> Month</th>
        <th>  </th>
    </tr>
    <aura:iteration items="{!v.payDetail}" var="pr">
        <tr>
            <td> {!pr.Month__c}{!pr.Year__c} </td> <br/>
            <td> <p><lightning:button variant="brand" label="SalarySlipGeneration" onclick="{!c.salarypageCall}" name="{!pr.Id}"  /></p></td> <br/>
        </tr>
    </aura:iteration>
</table>

({
    doInit : function(component, event, helper) {
        var action=component.get("c.salaryDetails");
        action.setCallback(this,function(re){
            var state=re.getState();
            if(state=='SUCCESS'){
                alert('values @@@@@@@@@@@@@'+re.getReturnValue());
                component.set("v.payDetail",re.getReturnValue());
            }
        });

        $A.enqueueAction(action);
    },
    salarypageCall: function(component, event, helper) {
        var myId = event.getSource().get('v.name');
        var vfUrl = 'https://empowerhrms-dev-ed--c.ap4.visual.force.com/apex/SalarySlipPage?Id=' + myId;
        var urlEvent = $A.get("e.force:navigateToURL");
        urlEvent.setParams({
            "url": vfUrl
        });
        urlEvent.fire();

    }
})

public class SalaryController {
    @AuraEnabled
    public static List<Salary_Slips__c> salaryDetails(){
        return [select id,Month__c,Year__c from  Salary_Slips__c ORDER BY Month__c ASC];
    }

}
6

Salesforce lightning aura framework is fully capable of supporting native html elements & handling the respective events.

So if you want to use anchor tag and bind it to your event handler. You can do something like follows

Component / App :

<a href="javascript:void(0)" onclick="{!c.doSomething}">
            Click me to do Something 
</a>

Controller.js :

   doSomething : function(component,event, helper) {
       console.log('Hey There .. the anchor was clicked');
       console.log(event);
       var href = event.srcElement.href;
       console.log(href);

    } 

You will have access to events emitted during the onclick process as well.

Sample Output:

Hyperlink

|improve this answer|||||
0

You can wrap it inside the tag instead of use the lightning:button

|improve this answer|||||

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.