You need to sign in to do that
Don't have an account?
muneeswar u
Lightning component to update contact record with checkbox field=true
Hi all,
I am new to coding.I am stuck here can any one please help me.Your help is appreciated.
My requirement is to display 10 contact records with checkbox beside to it , with update button at last.After clicking on the update button ,selected record should get updated.
Below is my code
***************************APEX CODE***********************************
public class getAllContactRecords
{
@AuraEnabled
public static List<contactListWrapper> getContacts()
{
List<contactListWrapper> lstContactWrap=new List<contactListWrapper>();
for(Contact con:[select id,Name from Contact limit 10])
{
lstContactWrap.add(new contactListWrapper(false,con));
}
return lstContactWrap;
}
/* wrapper class */
public class contactListWrapper
{
@AuraEnabled public boolean isChecked ;
@AuraEnabled public contact objContact ;
public contactListWrapper(boolean isChecked, contact objContact)
{
this.isChecked = isChecked;
this.objContact = objContact;
}
}
}
***************************Lightning component***********************************
<aura:component controller="getAllContactRecords" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickAction" access="global" >
<!-- aura attributes to store data/values -->
<aura:attribute name="ContactList" type="Contact[]"/>
<!-- call doInit method on component load -->
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:iteration items="{!v.ContactList}" var="obj">
<tr>
<td> <ui:inputCheckbox text="{!obj.objContact.Id}"
value="{!obj.isChecked}"
change="{!c.checkboxSelect}" aura:id="chkBoxId"/>
</td>
<td>
{!obj.objContact.Name} <br/>
</td>
</tr>
</aura:iteration>
<lightning:button label="Update" onclick="{!c.updateSelectedRecords}"/>
</aura:component>
***************************Lightning controller***********************************
({
doInit : function(component, event, helper)
{
var action=component.get("c.getContacts");
action.setCallback(this, function(data){
component.set("v.ContactList",data.getReturnValue());
});
$A.enqueueAction(action);
},
checkboxSelect : function(component, event, helper)
{
alert('test');
var selectedHeaderCheck = event.getSource().get("v.text");
var checkVar=component.find("v.chkBoxId");
alert(selectedHeaderCheck);
// $A.enqueueAction(action);
},
updateSelectedRecords : function(component, event, helper)
{
alert('test 1')
var check=component.find("v.chkBoxId");
if (check.get("v.value") == true)
{
// updateId.push(getAllId.get("v.text"));
}
// $A.enqueueAction(action);
}
})
I am new to coding.I am stuck here can any one please help me.Your help is appreciated.
My requirement is to display 10 contact records with checkbox beside to it , with update button at last.After clicking on the update button ,selected record should get updated.
Below is my code
***************************APEX CODE***********************************
public class getAllContactRecords
{
@AuraEnabled
public static List<contactListWrapper> getContacts()
{
List<contactListWrapper> lstContactWrap=new List<contactListWrapper>();
for(Contact con:[select id,Name from Contact limit 10])
{
lstContactWrap.add(new contactListWrapper(false,con));
}
return lstContactWrap;
}
/* wrapper class */
public class contactListWrapper
{
@AuraEnabled public boolean isChecked ;
@AuraEnabled public contact objContact ;
public contactListWrapper(boolean isChecked, contact objContact)
{
this.isChecked = isChecked;
this.objContact = objContact;
}
}
}
***************************Lightning component***********************************
<aura:component controller="getAllContactRecords" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickAction" access="global" >
<!-- aura attributes to store data/values -->
<aura:attribute name="ContactList" type="Contact[]"/>
<!-- call doInit method on component load -->
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:iteration items="{!v.ContactList}" var="obj">
<tr>
<td> <ui:inputCheckbox text="{!obj.objContact.Id}"
value="{!obj.isChecked}"
change="{!c.checkboxSelect}" aura:id="chkBoxId"/>
</td>
<td>
{!obj.objContact.Name} <br/>
</td>
</tr>
</aura:iteration>
<lightning:button label="Update" onclick="{!c.updateSelectedRecords}"/>
</aura:component>
***************************Lightning controller***********************************
({
doInit : function(component, event, helper)
{
var action=component.get("c.getContacts");
action.setCallback(this, function(data){
component.set("v.ContactList",data.getReturnValue());
});
$A.enqueueAction(action);
},
checkboxSelect : function(component, event, helper)
{
alert('test');
var selectedHeaderCheck = event.getSource().get("v.text");
var checkVar=component.find("v.chkBoxId");
alert(selectedHeaderCheck);
// $A.enqueueAction(action);
},
updateSelectedRecords : function(component, event, helper)
{
alert('test 1')
var check=component.find("v.chkBoxId");
if (check.get("v.value") == true)
{
// updateId.push(getAllId.get("v.text"));
}
// $A.enqueueAction(action);
}
})
Greetings to you!
Please try the below code, I have tested in my org and it is working fine. Kindly modify the code as per your requirement.
Apex:
Component:
Controller:
Application:
Reference: http://sfdcmonkey.com/2017/02/23/delete-multiple-records-using-checkbox-lightning-component/
I hope it helps you.
Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.
Thanks and Regards,
Khan Anas
I was wondering how you change the code so instead of the field value of Phone populating as 999999, it populates with the field value from hasrecordId (the record the lightning component is actioned from). Thank you!