Download as pdf or txt
Download as pdf or txt
You are on page 1of 16

LIGHTNING AND LWC SCENARIO BASED QUESTIONS

1. When we should use aura:handler in Salesforce lightning component ? can you write
syntex?

in lightning component <aura:handler... > is used for handle standard and custom events

we can create our custom lightning event and also use standard events, standard lightning
event is automatically fired when related event is fire

<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>

2.Can we access one javascript controller method on another controller method in salesforce
lightning component ?

No, we can’t able to access

3.Can we access one javascript helper method on another helper method in lightning
Component ?

Yes,We can able to access.

4.How to add a lightning button in Salesforce Lightning ?

use lighting button tag to add the button in component.

Example:
<lightning:button variant=”base” label=”Base” title=”Base action” onclick=”{! c.handleClick
}”/>

5. what is LDS IN salesforce lightning?

Use Lightning Data Service to load, create, edit, or delete a record in your component
without requiring Apex code. Lightning Data Service handles sharing rules and field-level
security for you. In addition to simplifying access to Salesforce data, Lightning Data Service
improves performance and user interface consistency.

No need to write any Apex class

No need to write SOQL

Field level security and record sharing is inbuilt

CRUD operation supported

Shared cache is used by all standard and custom components


Auto notification to all components

Supports offline in Salesforce 1

6.how to display success,warning,error,info message lightning page? can you write sample
code?

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes">
<div>
<lightning:button label="Information"
variant="brand"
onclick="{!c.showInfo}"/>
<lightning:button label="Error"
variant="destructive"
onclick="{!c.showError}"/>
<lightning:button label="Warning"
variant="neutral"
onclick="{!c.showWarning}"/>
<lightning:button label="Success"
variant="success"
onclick="{!c.showSuccess}"/>
</div>
</aura:component>

({
showInfo : function(component, event, helper) {
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
title : 'Info',
message: 'This is an information message.',
duration:' 5000',
key: 'info_alt',
type: 'info',
mode: 'dismissible'
});
toastEvent.fire();
},
showSuccess : function(component, event, helper) {
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
title : 'Success',
message: 'This is a success message',
duration:' 5000',
key: 'info_alt',
type: 'success',
mode: 'pester'
});
toastEvent.fire();
},
showError : function(component, event, helper) {
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
title : 'Error',
message:'This is an error message',
duration:' 5000',
key: 'info_alt',
type: 'error',
mode: 'pester'
});
toastEvent.fire();
},
showWarning : function(component, event, helper) {
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
title : 'Warning',
message: 'This is a warning message.',
duration:' 5000',
key: 'info_alt',
type: 'warning',
mode: 'sticky'
});
toastEvent.fire();
}
})

7. 1.How to display an alert message in lightnig component can you write sample code?

<aura:component >
<lightning:button label="Submit" variant="brand" onclick="{!c.handleClick}"/>

</aura:component>

({

handleClick : function(component, event, helper) {


alert('ALert message');

}
})

8.How to set the value to attribute , can you write simple example?

<aura:component >
<aura:attribute name="booleanvar" type="boolean" default="false"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
value is:{!v.booleanvar}
</aura:component>

({
doInit:function(component,event,helper){
component.set("v.booleanvar",true)
}
})

9. How to display the data in lightning component? can you write the code?

public class contactcontroller {


@AuraEnabled
public static list<contact> condata()
{
list<contact> col=[select id,LastName,Email,Phone from contact ];
return col;
}

<aura:component controller="contactcontroller">
<aura:attribute name="conlist" type="list"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<table class="slds-table slds-table_cell-buffer slds-table_bordered">

<tr >
<td>
LastName
</td>
<td>
Email
</td>
<td>Phone</td>

</tr>
<aura:iteration items="{!v.conlist}" var="con">
<tr>
<td>
{!con.LastName}
</td>
<td>
{!con.Email}
</td>

<td >
{!con.Phone}
</td>

</tr>
</aura:iteration>

</table>
</aura:component>

({
doInit :function(component, event, helper)
{

var action=component.get("c.condata");
action.setCallback(this,function(response){
var responseval=response.getReturnValue();
var state=response.getState();
console.log('state is'+state);
if(state==='SUCCESS')
{
component.set("v.conlist",responseval);
}
else
{
console.log('unable to process the data');
}

});
$A.enqueueAction(action);

}
})

order of execution in lightning


step 1:
we can calling the controller method in javascript
var action=component.get("c.displayContacts");
step 2:
we can pass the parameters

action.setParams({
});

step 3:
$A.enqueueAction(action) sends the request the server. More precisely, it adds the call to
the queue of asynchronous server calls.

$A.enqueueAction(action);

step 4:

action.setCallback() sets a callback action that is invoked after the server-side action returns.

10..How to display the contact records based on AccountId can you write code lightning?

public class accconbaes {


@AuraEnabled
public static List<Account> displayAccounts()
{
List<Account> acclist=[select Id,Name,Site from Account LIMIT 10];
return acclist;
}
@AuraEnabled
public static List<Contact> displayContacts(String searchkey)
{
System.debug('Value of the AccountId'+searchkey);
List<Contact> conlist=[select Id,AccountId,LastName,Email from Contact where
AccountId=:searchkey];
return conlist;

}
}

<aura:component controller="accconbaes">
<aura:attribute name="acclist" type="list"/>
<aura:attribute name="conlist" type="list"/>
<aura:attribute name="isDisplay" type="boolean" default="false"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<table class="slds-table slds-table_cell-buffer slds-table_bordered">
<tr>
<td>Action</td>
<td>Id</td>
<td>Name</td>

</tr>
<aura:iteration items="{!v.acclist}" var="acc">
<tr>
<td>
<lightning:input type="radio" name="radioButon" value="{!acc.Id}"
onchange="{!c.showData}"/>

</td>
<td>
{!acc.Id}
</td>
<td>
{!acc.Name}
</td>

</tr>

</aura:iteration>

</table>
<aura:if isTrue="{!v.isDisplay}">
<table class="slds-table slds-table_cell-buffer slds-table_bordered">
<tr>

<td>Id</td>
<td>LastName</td>

</tr>
<aura:iteration items="{!v.conlist}" var="con">
<tr>

<td>
{!con.Id}
</td>
<td>
{!con.LastName}
</td>

</tr>

</aura:iteration>
</table>

</aura:if>

</aura:component>

({
doInit : function(component, event, helper) {
var action=component.get("c.displayAccounts");
action.setCallback(this,function(response){
var state=response.getState();
var responseval=response.getReturnValue();
if(state==='SUCCESS')
{
component.set("v.acclist",responseval);
}
else
{
alert('unable to process the request');
}

});
$A.enqueueAction(action);
},
showData:function(component,event,helper){
var currentAccountId=event.getSource().get("v.value");
component.set("v.isDisplay",true);
var action=component.get("c.displayContacts");
action.setParams({
searchkey:currentAccountId

});
action.setCallback(this,function(response){
var state=response.getState();
var responseval=response.getReturnValue();
if(state==='SUCCESS')
{
component.set("v.conlist",responseval);
}
else
{
alert('unable to process the request');
}

});
$A.enqueueAction(action);
}
})

<aura:application extends="force:slds" >


<c:acccon></c:acccon>
</aura:application>

11.Dynamic search in salesforce lightning component,can you write example?

public class accconbaes {


@AuraEnabled
public static List<Account> displayAccounts(String searchkey)
{
String searchword='%'+searchkey+'%';
System.debug('userinput'+searchword);
List<Account> returnlist=new List<Account>();
for(Account acc:[select Id,Name,Site from Account where Name like:searchword])
{
returnlist.add(acc);

}
return returnlist;
}

<aura:component controller="accconbaes">
<aura:attribute name="accName" type="String"/>
<aura:attribute name="acclist" type="list"/>
<aura:attribute name="isDisplay" type="boolean" default="false"/>
<lightning:input type="text" label="AccountName" value="{!v.accName}"
onchange="{!c.handleSearch}" style="width:20%;"/>
Records size:{!v.acclist.length}
<aura:if isTrue="{!v.isDisplay}">
<aura:if isTrue="{!v.acclist.length!=0}">
<table class="slds-table slds-table_cell-buffer slds-table_bordered">
<tr>
<td>Name</td>
</tr>
<aura:iteration items="{!v.acclist}" var="acc">
<tr>
<td>
{!acc.Name}
</td>
</tr>

</aura:iteration>

</table>
</aura:if>
</aura:if>
</aura:component>

({
handleSearch : function(component, event, helper) {
component.set("v.isDisplay",true);
var action=component.get("c.displayAccounts");
action.setParams({
searchkey:component.get("v.accName")
});
action.setCallback(this,function(response){
var state=response.getState();
var responval=response.getReturnValue();
if(state==='SUCCESS')
{
component.set("v.acclist",responval);
}
else
{
alert('Error in processing the data');
}

});
$A.enqueueAction(action);

}
})

<aura:application extends="force:slds" >


<c:acccon></c:acccon>
</aura:application>

12.How to delete the records with a button in lightning , can you write code?

public class AccountDelController


{
@AuraEnabled
public static List<Account> displayAccounts()
{
List<Account> acclist=[select Id,Name from Account];
return acclist;
}
@AuraEnabled
public static List<Account> deleteAccRecord(String accId)
{
System.debug('AccountId'+accId);
Account acc=[select Id,Name from Account where Id=:accId];
delete acc;
return displayAccounts();
}
}

<aura:component controller="AccountDelController">
<aura:attribute name="acclist" type="list"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<table class="slds-table slds-table_cell-buffer slds-table_bordered">
<tr>
<td><b>Id</b></td>
<td><b>Name</b></td>
<td><b>Action</b></td>

</tr>
<aura:iteration items="{!v.acclist}" var="acc">
<tr>
<td>{!acc.Id}</td>
<td>{!acc.Name}</td>
<td>
<lightning:button label="Delete" value="{!acc.Id}" onclick="{!c.handleDelete}"/>
</td>
</tr>

</aura:iteration>
</table>

</aura:component>

({
doInit : function(component, event, helper) {
var action=component.get("c.displayAccounts");
action.setCallback(this,function(response){
var state=response.getState();
var responsval=response.getReturnValue();
if(state==='SUCCESS')
{
component.set("v.acclist",responsval);
}
else
{
alert('unable to process the data');
}

});
$A.enqueueAction(action);

},
handleDelete:function(component,event,helper){
var currentRecordId=event.getSource().get("v.value");
//alert(currentRecordId);
var action=component.get("c.deleteAccRecord");
action.setParams({
accId:currentRecordId

});
action.setCallback(this,function(response){
component.set("v.acclist",response.getReturnValue());

});
$A.enqueueAction(action);

}
})

<aura:application extends="force:slds">
<c:AccountDeleteComponent/>
</aura:application>

13. Events in ligtning can you write component event example?

child to parent (component composition)

step 1:we need to create event


demoEvent
==========
<aura:event type="COMPONENT">
<aura:attribute name="Info" type="String"/>
</aura:event>

childComponent
==============
<aura:component>

//This is the way how we will regitering the event in component

//You can give any name while registering the event but the type should be name of the
event
<aura:registerEvent name="sampleDemo" type="c:demoEvent"/>

<lightning:button label="Submit" onclick="{!c.handleClick}"/>


</aura:component>

({
handleClick:function(component,event,helper)
{
//getting the event properties
var comEvt=component.getEvent("sampleDemo");
//setting the value to the attribute
comEvt.setParams({
"Info":"Welcome to events"
//Info is the attribute name
//welcome to events in the value to the attribute
});
//fire is used to fire the event.
//If you don't fire the event then it won't work
comEvt.fire();
}
})

Parent component:
=================
<aura:component>

<c:childComponent/>
<aura:handler event="sampleDemo" type="c:demoEvent" action="{!c.handleEvent}"/>
</aura:component>
({
handleEvent:function(component,event,helper)
{
//getParam is used to get the value from child component(event attribute)
var val=event.getParam("Info");
alert(val);
}
})

<aura:application>
<c:parentComponent/>
</aura:application>

14.Application Event in salesforce lightning ,can you write syntex?

var appEvent = $A.get("e.c:aeEvent");

15.What is @AuraEnabled(cacheable=true)
If you want to access the data then we should include this annotation to an apex class
method.

16.What is wire?
If you are dealing with apex class methods then we should use wire property

17.How many files will generated when you create a LWC component?

1.html
2.javascript files
3.meta data file(.xml)

18. what are the decoraters in lwc ?

@Api
@Track
@Wire

19.How to call the apex class in lwc?

import fetchAccounts from '@salesforce/apex/AccountDeleteController.fetchAccounts';

20. How to call the apexclass method in javascript file?

@Wire
Imperative method
.then(result=>{
this.records=result;
this.error=undefined;
})
.catch(error=>{
this.error=error;
this.records=undefined;
});

21.How to refresh the page in Lwc?

import { refreshApex } from '@salesforce/apex';

22. what is aura method in lightning?

This enables you to directly call a method in a component’s client side controller instead of
firing and handling a component event.
Using aura method simplifies the code needed for a parent component to call a method on a
child component that it contains.

23.How to call a method in salesforce lightning auramethod?


<aura:component >
<aura:method name="sampleMethod" action="{!c.fireMethod}">
<aura:attribute name="firstName" type="String" default="Naveen"/>
</aura:method>

</aura:component>

({
fireMethod : function(component, event, helper) {
var params=event.getParam("arguments");
if(params){
var param1=params.firstName;
alert('Yes I am in child component'+param1);
}

}
})

<aura:component >
<c:ChildComponent77 aura:id="childComp"/>
<lightning:button label="submit" onclick="{!c.handleClick}"/>
</aura:component>

({
handleClick : function(component, event, helper) {
var childcmp=component.find("childComp");
childcmp.sampleMethod();

}
})

You might also like