Apex Code Development You need to sign in to do that
Don't have an account?
LUIGI EMANUEL TAORMINA how to create a new lightning datatable by clicking the Add button in the lightning datatable passing the record into the new table?
I have a table created with lightning datatable where I get records from a query in an apex class. I added an add button where the click of the button fetches the record from me and creates a new table with the fetched record. How can I do ?
Component:
Controller:
Component:
<aura:attribute name="mydata" type="Object"/>
<aura:attribute name="mycolumns" type="List"/>
<aura:handler name="init" value="{! this }" action="{! c.init }"/>
<div class="container" style="height:280px">
<lightning:datatable style="color:blue ;font-size:12px" data="{! v.mydata }"
columns="{! v.mycolumns }"
keyField="Id"
hideCheckboxColumn="true"
/>
</div>
Controller:
init: function (cmp, event, helper) {
cmp.set('v.mycolumns', [
{ label: 'Name Number', fieldName: 'Name'},
{ label: 'Product Name', fieldName: 'Name__c', type: 'text'},
{ label: 'Weight For Single Product', fieldName: 'WeightForSingleProduct__c', type: 'number'},
{ label: 'Available Quantity', fieldName: 'AvailableQuantity__c', type: 'number'},
{ label: 'Genre', fieldName: 'GenreBook__c', type: 'text'},
{type: "button", typeAttributes: {
label: 'Add Cart',
name: '',
title: '',
disabled: false,
value: '',
iconPosition: ''
}},
{type: "button", typeAttributes: {
label: 'Preview Cart',
name: '',
title: '',
disabled: false,
value: '',
iconPosition: 'l'
}}
]);
helper.getData(cmp);
}
Helper:
getData : function(cmp) {
var action = cmp.get('c.getSearchQuery');
action.setCallback(this, $A.getCallback(function (response) {
var state = response.getState();
if (state === "SUCCESS") {
cmp.set('v.mydata', response.getReturnValue());
} else if (state === "ERROR") {
var errors = response.getError();
console.error(errors);
}
}));
$A.enqueueAction(action);
}
Try Below Code
<aura:component controller="AccountListController2"> <aura:attribute type="Account[]" name="acctList"/> <aura:attribute type="Account[]" name="acctList2"/> <aura:attribute name="mycolumns" type="List"/> <aura:attribute name="truthy" type="Boolean" default='false'/> <aura:handler name="init" value="{!this}" action="{!c.init}"/> <lightning:datatable aura:id="acctTable" data="{! v.acctList }" columns="{! v.mycolumns }" keyField="Id" onrowselection="{! c.getSelectedName }"/> <lightning:button variant="base" label="Base" title="Base action" onclick="{! c.handleClick }"/> <aura:if isTrue="{!v.truthy}"> <lightning:datatable aura:id="acctTable" data="{! v.acctList2 }" columns="{! v.mycolumns }" keyField="Id" hideCheckboxColumn="true" onsave="{! c.onSave }" onrowselection="{! c.getSelectedName }"/> </aura:if> </aura:component> Controller ({ init : function( component, event, helper ) { component.set( 'v.mycolumns', [ {label: 'Account Name', fieldName: 'Name', type: 'text', editable:'true'} ]); helper.fetchAccounts(component); }, getSelectedName: function (component, event) { var selectedRows = event.getParam('selectedRows'); component.set( "v.acctList2", event.getParam('selectedRows') ); }, handleClick : function (component, event, helper) { component.set( "v.truthy", true ); } }) Helper ({ fetchAccounts : function( component ) { var action = component.get( "c.fetchAccts" ); action.setCallback(this, function( response ) { var state = response.getState(); if (state === "SUCCESS") component.set( "v.acctList", response.getReturnValue() ); }); $A.enqueueAction(action); } })Please Mark It As Best Asnwerr If It HelpsThank You!
All Answers
OnClick Of Add Button Does It get New Records Or The Selected Records From One Datable TO Another Datatable
OnClick of Add button obtains the selected record to be added to a new datatable
Try Below Code
<aura:component controller="AccountListController2"> <aura:attribute type="Account[]" name="acctList"/> <aura:attribute type="Account[]" name="acctList2"/> <aura:attribute name="mycolumns" type="List"/> <aura:attribute name="truthy" type="Boolean" default='false'/> <aura:handler name="init" value="{!this}" action="{!c.init}"/> <lightning:datatable aura:id="acctTable" data="{! v.acctList }" columns="{! v.mycolumns }" keyField="Id" onrowselection="{! c.getSelectedName }"/> <lightning:button variant="base" label="Base" title="Base action" onclick="{! c.handleClick }"/> <aura:if isTrue="{!v.truthy}"> <lightning:datatable aura:id="acctTable" data="{! v.acctList2 }" columns="{! v.mycolumns }" keyField="Id" hideCheckboxColumn="true" onsave="{! c.onSave }" onrowselection="{! c.getSelectedName }"/> </aura:if> </aura:component> Controller ({ init : function( component, event, helper ) { component.set( 'v.mycolumns', [ {label: 'Account Name', fieldName: 'Name', type: 'text', editable:'true'} ]); helper.fetchAccounts(component); }, getSelectedName: function (component, event) { var selectedRows = event.getParam('selectedRows'); component.set( "v.acctList2", event.getParam('selectedRows') ); }, handleClick : function (component, event, helper) { component.set( "v.truthy", true ); } }) Helper ({ fetchAccounts : function( component ) { var action = component.get( "c.fetchAccts" ); action.setCallback(this, function( response ) { var state = response.getState(); if (state === "SUCCESS") component.set( "v.acctList", response.getReturnValue() ); }); $A.enqueueAction(action); } })Please Mark It As Best Asnwerr If It HelpsThank You!
type: button typeAttributes: {......