+ Start a Discussion
sumit dsumit d 

i want to add a blank row below contact list using lightning component.

<aura:component controller="MyContactListController" implements="force:lightningQuickAction" access="global">
    
    <aura:attribute name="recordId" type="Id" />
    <aura:attribute name="Account" type="Account" />
    <aura:attribute name="Contacts" type="Contact" />
     <aura:attribute name="Opportunities" type="Opportunity" />  
    <aura:attribute name="Columns" type="List" />
    <aura:attribute name="MyColumns" type="List"/>
    <aura:handler name="init" value="{!this}" action="{!c.myAction}" />
    <aura:handler name="AddRowEvt" event="c:AddNewRowEvt" action="{!c.addNewRow}"/>

    
    <force:recordData aura:id="accountRecord"
                      recordId="{!v.recordId}"
                      targetFields="{!v.Account}"
                      layoutType="FULL"
                      />
    <lightning:card iconName="standard:contact" title="{! 'Contact List for ' + v.Account.Name}">
        <!-- Contact list goes here -->
        <lightning:datatable data="{! v.Contacts }" columns="{! v.Columns }" keyField="Id" hideCheckboxColumn="true"/>
         <aura:iteration items="{!v.contactList}" var="item" indexVar="index">
                <c:dynamicRowItem ContactInstance="{!item}" rowIndex="{!index}" />
            </aura:iteration>

    </lightning:card>
    <div class="slds-modal__footer">
        <div class="slds-x-small-buttons--horizontal">
          <button class="slds-button slds-button--neutral">Create Contact</button>
          
        </div>
      </div>
    
    <lightning:card iconName="standard:opportunity" title="{! 'Opportunity List for ' + v.Account.Name}">
        <!-- Opportunity list goes here -->
        <lightning:datatable data="{! v.Opportunities }" columns="{! v.MyColumns }" keyField="Id" hideCheckboxColumn="true"/>
        <br/>
    </lightning:card>
    
    <div class="slds-modal__footer">
        <div class="slds-x-small-buttons--horizontal">
          <button class="slds-button slds-button--neutral">Create Opportunity</button>
          
        </div>
      </div>
</aura:component> this is my component ,any suggestions?
Best Answer chosen by sumit d
bhanu_prakashbhanu_prakash
Hi Amit
Mark as best answer, If it resloves !!
add below code after these div tag
 
<div class="slds-modal__footer">
        <div class="slds-x-small-buttons--horizontal">
          <button class="slds-button slds-button--neutral">Create Contact</button>
          
        </div>
      </div>

add these
 
<table>
        <th class= "slds-space">
        <tr>
        </tr>
        </th>       
    </table>

and in css
.THIS .slds-space{
    border: 5px;    
    background: blue;
    height: 10px;
    margin: 5px;       
}
if you want to increase  height change px 
Mark as resloved if it helps :) :)
Thanks, 
Bhanu Prakash
visit ForceLearn.com​  (https://www.forcelearn.com)




 

All Answers

bhanu_prakashbhanu_prakash
Hi Amit
Mark as best answer, If it resloves !!
add below code after these div tag
 
<div class="slds-modal__footer">
        <div class="slds-x-small-buttons--horizontal">
          <button class="slds-button slds-button--neutral">Create Contact</button>
          
        </div>
      </div>

add these
 
<table>
        <th class= "slds-space">
        <tr>
        </tr>
        </th>       
    </table>

and in css
.THIS .slds-space{
    border: 5px;    
    background: blue;
    height: 10px;
    margin: 5px;       
}
if you want to increase  height change px 
Mark as resloved if it helps :) :)
Thanks, 
Bhanu Prakash
visit ForceLearn.com​  (https://www.forcelearn.com)




 
This was selected as the best answer
sumit dsumit d
its not creating blank row, any suggestion for that?
 
bhanu_prakashbhanu_prakash
Hi Amit,
colour which is blue indicates as blank space, you can increase height and colour, let me know once if it not suite can you provide screenshot of required blank. i can update you :) 

Thanks, 
Bhanu Prakash
visit ForceLearn.com​