• SHAIK MOULALI369
  • NEWBIE
  • 30 Points
  • Member since 2021

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 6
    Questions
  • 2
    Replies
Adding or deleting rows on custom object in lightning component.
while executing helper methode "action.setParams();" and "action.setCallback();" are not working properly.

Component Code : 
<aura:component controller="Schools_Buddy_Student" Implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,
                                                     force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global">     
    <aura:attribute name="StudentList" type="Student__c[]"/>
    <aura:attribute name="Gender" type="String[]" default=" , Male, Female, Transgender"/>
    
    <div class="slds-m-around--xx-large">
        <div class="slds-float_right slds-p-bottom_small">
            <h1 class="slds-page-header__title">Add Row 
                <lightning:buttonIcon iconName="utility:add"  size="large" variant="bare" alternativeText="Add" onclick="{!c.addRow}"/>
            </h1>
        </div>
        <div class="container-fluid">        
            <table class="slds-table slds-table_bordered slds-table_cell-buffer"> 
                <thead>
                    <tr class="slds-text-title_caps">
                        <th scope="col">
                            <div class="slds-truncate">#</div>
                        </th>
                        <th scope="col">
                            <div class="slds-truncate" title="Student Name">Student Name</div>
                        </th>
                        <th scope="col">
                            <div class="slds-truncate" title="Student Email">Email ID</div>
                        </th>
                        <th scope="col">
                            <div class="slds-truncate" title="Phone">Phone Number</div>
                        </th>
                        <th scope="col">
                            <div class="slds-truncate" title="Action">Action</div>
                        </th>
                    </tr>
                </thead>   
                <tbody>      
                    <aura:iteration items="{!v.StudentList}" var="acc" indexVar="index">
                        <tr>
                            <td> 
                                {!index + 1}
                            </td>
                            <td>
                                <lightning:input name="accName" type="text" required="true" maxlength="50" label="Student Name" value="{!acc.Name}" />
                            </td>
                            <td>
                              	<lightning:input name="" type="text"  maxlength="80" label="Email ID" value="{!acc.Email_ID__c}" />
                            </td>
                            <td>
                                <lightning:input name="accPhone" type="phone" maxlength="50" label="Phone" value="{!acc.Phone__c}" />
                            </td>
                            <td>
                                <a onclick="{!c.removeRow}" data-record="{!index}">
                                    <lightning:icon iconName="utility:delete" size="small" alternativeText="Delete"/>
                                    <span class="slds-assistive-text">Delete</span>
                                </a>
                            </td> 
                        </tr>
                    </aura:iteration>
                </tbody>
            </table>
            <div class="slds-align_absolute-center slds-p-top_small">
                <lightning:button variant="brand" label="Submit" title="Brand action" onclick="{!c.save}" />
            </div>
        </div>
    </div>
</aura:component>
Controller Code :
({
    addRow: function(component, event, helper) {
        helper.addAccountRecord(component, event);
       
    },     
    removeRow: function(component, event, helper) {
        var StudentList = component.get("v.StudentList");
        var selectedItem = event.currentTarget;
        var index = selectedItem.dataset.record;
        StudentList.splice(index, 1);
        component.set("v.StudentList", StudentList);
    },     
    save: function(component, event, helper) {
        if (helper.validateAccountList(component, event)) {
            helper.saveAccountList(component, event);
            alert('SaveCmp');
        }
    },
})
Helper methode : 
({
    addAccountRecord: function(component, event) {
        var StudentList = component.get("v.StudentList");
        StudentList.push({
            'sobjectType': 'Student__c',
            'Name': '',
            'Email_ID__c': '',
            'Phone__c': ''
        });
        component.set("v.StudentList", StudentList);
    },     
    validateAccountList: function(component, event) {
        var isValid = true;
        var StudentList = component.get("v.StudentList");
        for (var i = 0; i < StudentList.length; i++) {
            if (StudentList[i].Name == '') {
                isValid = false;
                alert('Account Name cannot be blank on row number ' + (i + 1));
            }
        }
        return isValid;
    },     
    saveAccountList: function(component, event, helper) {
        alert('before calling saveStudent');
        var action = component.get("c.saveStudents");
        alert('aftr calling saveStudent');
        action.setParams({
            "stList": component.get("v.StudentList")
        });
        alert('After setParams');
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                component.set("v.StudentList", []);
                alert('Account records saved successfully');
            }
            else if (state === "INCOMPLETE") {
                alert('Incomplete Action');
            }
            else if (state === "ERROR") {
                var errors = response.getError();
                if (errors) {
                    if (errors[0] && errors[0].message) {
                        console.log("Error message: " + 
                                 errors[0].message);
                        alert('errors[0].message : '+errors[0].message);
                    }
                } else {
                    alert("Unknown error");
                }
            }
        }); 
        $A.enqueueAction(action);
    },
})
Server side Controller Code :
public with sharing class Schools_Buddy_Student {     
    
    @AuraEnabled
    public static void saveStudents(List<Student__c> stList){
        Insert stList;
    }
}
Image of Adding multiple student data in rows:

User-added image


Kindly suggest how to resolve this Issue.
 
Using Apex class to Insert contact and return inserted contact values, i have write component inside a component.
I am getting a Error as : 
" Action failed: c:QuickContact$controller$dosave [action.setparams is not a function] Failing descriptor: {c:QuickContact$controller$dosave} "
Kindly Suggest how to resolve this Issue.
Apex Class : 
public class ContactListController {
    @auraEnabled
    public static contact createContact(Contact con, Id AccountId){
        con.AccountId = AccountId;
        insert con;
        return con;
    }
}
Comp 1 :
<aura:component Controller="ContactListController" 
                implements="force:hasRecordId,force:hasSobjectName,flexipage:availableForAllPageTypes" >
    <aura:attribute name="ContactList" type="Contact[]"/>
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <c:QuickContact accountId ="{!v.recordId}" />
    
    <div class="slds-p-around_xxx-small">
        <div class="slds-grid slds-wrap">
        <aura:iteration items="{!v.ContactList}" var="con">
        
              <div class="slds-col slds-size_1-of-3 slds-p-around_xxx-small"> 
        <lightning:card footer="{!con.Email}" title="{!con.LastName}" iconName="action:add_contact">
            <aura:set attribute="actions"> 
            <lightning:button name="{!con.Id}" variant="brand" label="View Details" onclick="{!c.DoRedirect}"/>
            </aura:set>
            <p class="slds-p-horizontal_xxx-small">
                {!con.FirstName}&nbsp; {!con.LastName} <br/>
                {!con.phone}
            </p>
        </lightning:card>
            </div>
            
       </aura:iteration>
       </div> 
    </div>   
     
</aura:component>
Comp 2 :
<aura:component Controller="ContactListController">
    <aura:attribute name="accountId" type="String" />
    <aura:attribute name="CreateContact" type="Contact" default="{ 
                                                                 SObjectName : 'Contact',
                                                                 FirstName : '',
                                                                 LastName : '',
                                                                 Email : '',
                                                                 Phone : ''
                                                                 }"/>
    <div class='slds-p-around_xx-small'>
        <lightning:input type="text" value="{!v.CreateContact.FirstName}" label="First Name" required="true"/>
        <lightning:input type="text" value="{!v.CreateContact.LastName}" label="Last Name" required="true"/>
        <lightning:input type="Email" value="{!v.CreateContact.Email}" label="Email ID" required="true"/>
        <lightning:input type="Phone" value="{!v.CreateContact.Phone}" label="Phone Number" required="true"/><br/>
        <lightning:button label="Create Contact" variant="brand" onclick="{!c.dosave}"/>
    </div>
</aura:component>
Controller code for comp 2 :
({
    dosave : function(component, event, helper) {
        var action = component.get('c.createContact');
        action.setparams({
            con : component.get('v.CreateContact'),
            AccountId : component.get('v.accountId')
        });
        action.setcallback(this,function(response){
            var state = response.getState();
            alert(state);
            if(state === 'SUCCESS' || state ==='DRAFT'){
                var responseValue = response.getReturnValue();
                
            }else if(state === 'INCOMPLETE'){
                
            }else if(state === 'ERROR'){
                
            }            
        }, 'ALL');
        $A.enqueueAction(action);
    }
})
 
While clickiing lightning button (Toggle), it has woring only 2 times and after not executing properly.

Component Code : 
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    <aura:attribute name="buttonLabel" type="String" default="Search Button"/>
    <aura:attribute name="newLabel" type="String" default="New Button"/>
    <aura:attribute name="isNewAvailable" type="Boolean" default="false"/>
    
    <aura:attribute name="CarTypes" type="String[]" default="All Types,Sport Car,Luxury Car,Van"/>
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    
    <lightning:layout horizontalAlign="center">
        <lightning:layoutItem padding="around-medium">
            <lightning:select name="selectItem " aura:id="CarType" label="All Types" variant="label-hidden" > 
                <option value="" text="All Types"/>
                <aura:iteration items="{!v.CarTypes}" var="CarType">
                    <option value="{!CarType}" text="{!CarType}"/>
                </aura:iteration>
    </lightning:select>
        
            <lightning:button label="{!v.buttonLabel}" onclick="{!c.onSearchClick}" variant="brand"/>
            <lightning:button variant='neutral' label="Toggle Button" onclick="{!c.toggleButton}" />
            <aura:if isTrue="{!v.isNewAvailable}">    
                <lightning:button variant='neutral' label="{#v.newLabel}"/>
                <aura:set attribute="else">
                    New button cannot be added here
                </aura:set>    
            </aura:if>  
            
        </lightning:layoutItem>
    </lightning:layout>
</aura:component>
Controller Code : 
({
    onSearchClick : function(component, event, helper) {
        helper.handlerOnSeearchClick(component, event, helper)
    },
    
    toggleButton : function(component, event, helper) {
        var CurrentValue = component.get("v.isNewAvailable");
        console.log('Method is exicuted');
        if(CurrentValue){
            console.log('New value--1'+CurrentValue);
          component.set("v.isNewAvailable","false");
            
        }    
        else{
             console.log('New value--2'+CurrentValue);
            component.set("v.isNewAvailable","true");
           
        }  
    },
    doInit : function(component, event, helper) {
        
        var CarTypes = component.set("v.CarTypes");
        component.set("v.CarTypes", ['Sport Car','Luxury Car','Van']);
        
    }
    
})
Helper Code : 
({
    handlerOnSeearchClick : function(component, event, helper) {
        alert('Search Button was clicked');
    }
})

this is my complete code, Kindly suggest how to resolve this type of Issues.
Below is the O/P of my my code.
O/P of Toggle button aftr clicking 5 times
While clicking button here the page is not navigate to SObject.

Apex Class :
public class ContactListController {

    @auraEnabled
    public static List<contact> getContactList(String accountId){
        List<Contact> ContactList = New List<Contact>([Select Id, FirstName, LastName, Name, Email, phone 
                                                       from contact where Email != null AND AccountId =: accountId ]);
        return ContactList; 
    }
}
Component Class : 
<aura:component Controller="ContactListController" 
                implements="force:hasRecordId,flexipage:availableForAllPageTypes" >
    <aura:attribute name="ContactList" type="Contact[]"/>
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    
    <div class="slds-p-around_xxx-small">
        <div class="slds-grid slds-wrap">
        <aura:iteration items="{!v.ContactList}" var="con">
        
              <div class="slds-col slds-size_1-of-3 slds-p-around_xxx-small"> 
        <lightning:card footer="{!con.Email}" title="{!con.LastName}" iconName="action:add_contact">
            <aura:set attribute="actions"> 
            <lightning:button name="{!con.Id}" variant="brand" label="View Details" onclick="{!c.DoRedirect}"/>
            </aura:set>
            <p class="slds-p-horizontal_xxx-small">
                {!con.FirstName}&nbsp; {!con.LastName} <br/>
                {!con.phone}
            </p>
        </lightning:card>
            </div>
            
       </aura:iteration>
       </div> 
    </div>   
     
</aura:component>
Controller Class :
({
    doInit : function(component, event, helper) {
        /* Step 1 */
        var action = component.get('c.getContactList');
        /* Step 2 */
        action.setParams({
            accountId : component.get('v.recordId'),
        });
        /* Step 4 */
        action.setCallback(this, function(response){
            var responseValue = response.getReturnValue();
            console.log('responseValue', responseValue);
            component.set('v.ContactList',responseValue)
        }, 'SUCCESS');
        /* Step 4 */
        $A.enqueueAction(action, true);
        
    },
    DoRedirect : function(component, event, helper) {
           var eventsource = event.getsource();
        var id = eventsource.get('v.name'); 
        var navEvt = $A.get("e.force:navigateToSObject");
    navEvt.setParams({
      "recordId": "id",
      "slideDevName": "detail"
    });
    navEvt.fire();
    },
})

Here c.DoRedirect is working or not, plsease suggest me is there any error in the above code.
Getting an Error : 
" Failed to save ContactListController.js: ESLINT_ERROR: {c:ContactList - CONTROLLER} line:col [7:23] --> Parsing error: Shorthand property assignments are valid only in destructuring patterns : Source "

my client side controller code : 
({
    doInit : function(component, event, helper) {
        /* Step 1 */
        var action = component.get('c.getContactList');
        /* Step 2 */
        action.setParams({
            accountId = component.get('v.recordId'),
        });
        /* Step 4 */
        action.setCallback(this, function(response){
            var responseValue = response.getReturnValue();
            console.log('responseValue', responseValue);
            component.set('v.ContactList',responseValue)
        }, 'SUCCESS');
        /* Step 4 */
        $A.enqueueAction(action, true);
        
    }
})

Passing recordId(cmp class) to AccountId(Apex class), getting this error.
Kindly sugegst how to resolve this.
<lightning:card footer="{!con.Email}" title="{!con.LastName}" iconName="action:add_contact">
            <aura:set attribute="action">
                <lightning:Button Label="View Details" Variant="brand"/>
            </aura:set>
            <p class="slds-p-horizontal-small">
                {!con.FirstName}&nbsp; {!con.LastName} <br/>
                {!con.Phone}
            </p>
        </lightning:card>

For the Above coding i am getting an Error: 
ContactList.cmp: The attribute "action" was not found on the COMPONENT markup://lightning:card: Source.

anyone can help how to solve this.
While clickiing lightning button (Toggle), it has woring only 2 times and after not executing properly.

Component Code : 
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    <aura:attribute name="buttonLabel" type="String" default="Search Button"/>
    <aura:attribute name="newLabel" type="String" default="New Button"/>
    <aura:attribute name="isNewAvailable" type="Boolean" default="false"/>
    
    <aura:attribute name="CarTypes" type="String[]" default="All Types,Sport Car,Luxury Car,Van"/>
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    
    <lightning:layout horizontalAlign="center">
        <lightning:layoutItem padding="around-medium">
            <lightning:select name="selectItem " aura:id="CarType" label="All Types" variant="label-hidden" > 
                <option value="" text="All Types"/>
                <aura:iteration items="{!v.CarTypes}" var="CarType">
                    <option value="{!CarType}" text="{!CarType}"/>
                </aura:iteration>
    </lightning:select>
        
            <lightning:button label="{!v.buttonLabel}" onclick="{!c.onSearchClick}" variant="brand"/>
            <lightning:button variant='neutral' label="Toggle Button" onclick="{!c.toggleButton}" />
            <aura:if isTrue="{!v.isNewAvailable}">    
                <lightning:button variant='neutral' label="{#v.newLabel}"/>
                <aura:set attribute="else">
                    New button cannot be added here
                </aura:set>    
            </aura:if>  
            
        </lightning:layoutItem>
    </lightning:layout>
</aura:component>
Controller Code : 
({
    onSearchClick : function(component, event, helper) {
        helper.handlerOnSeearchClick(component, event, helper)
    },
    
    toggleButton : function(component, event, helper) {
        var CurrentValue = component.get("v.isNewAvailable");
        console.log('Method is exicuted');
        if(CurrentValue){
            console.log('New value--1'+CurrentValue);
          component.set("v.isNewAvailable","false");
            
        }    
        else{
             console.log('New value--2'+CurrentValue);
            component.set("v.isNewAvailable","true");
           
        }  
    },
    doInit : function(component, event, helper) {
        
        var CarTypes = component.set("v.CarTypes");
        component.set("v.CarTypes", ['Sport Car','Luxury Car','Van']);
        
    }
    
})
Helper Code : 
({
    handlerOnSeearchClick : function(component, event, helper) {
        alert('Search Button was clicked');
    }
})

this is my complete code, Kindly suggest how to resolve this type of Issues.
Below is the O/P of my my code.
O/P of Toggle button aftr clicking 5 times
<lightning:card footer="{!con.Email}" title="{!con.LastName}" iconName="action:add_contact">
            <aura:set attribute="action">
                <lightning:Button Label="View Details" Variant="brand"/>
            </aura:set>
            <p class="slds-p-horizontal-small">
                {!con.FirstName}&nbsp; {!con.LastName} <br/>
                {!con.Phone}
            </p>
        </lightning:card>

For the Above coding i am getting an Error: 
ContactList.cmp: The attribute "action" was not found on the COMPONENT markup://lightning:card: Source.

anyone can help how to solve this.