2

I have an apex controller class:

public with sharing class CatTrackingController {

    @auraEnabled
public static list<Cats__c> getCats(){
    return [ SELECT Id, Cat_Name__c, Cat_Breed__c, Cat_Gender__c, Cat_Nickname__c, Cat_Personality__c
    FROM Cats__c
    ];
}

@auraEnabled
public static Cats__c createCats(string name, string catName, string Nickname, String Breed, String Gender, String Personality){
    Cats__c cats = new Cats__c();
    cats.Name = name;
    cats.Cat_Name__c = catName;
    cats.Cat_Nickname__c = Nickname;
    cats.Cat_Breed__c = Breed;
    cats.Cat_Gender__c = Gender;
    cats.Cat_Personality__c = Personality;
    insert cats;
    return [SELECT Id, Cat_Name__c, Cat_Breed__c, Cat_Gender__c, Cat_Nickname__c, Cat_Personality__c
    FROM Cats__c];
}

}

and the lightning component page:

<aura:component description="CatTracking" implements="flexipage:availableForAllPageTypes" access="global">
    <aura:attribute name="cats" type="Cats__c[]"/>

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

<div class="slds-align--absolute-center">
    <p class="slds-text-heading--label">Click any Cat to view or edit details</p>
</div>
<div class="slds-align--absolute-center">
    <ui:button aura:id="new" label="Create new Cat" press="{!c.loadNew}"/>
    <br/>
</div>
<table class="myClass slds-table slds-table--bordered slds-table--cell-buffer">
    <thead>
    <tr class="slds-text-heading--label">
        <th scope="col">
            <div class="slds-truncate" title="Cat Name">Name</div>
        </th>
        <th scope="col">
            <div class="slds-truncate" title="Nickname">Nickname</div>
        </th>
        <th scope="col">
            <div class="slds-truncate" title="Gender">Gender</div>
        </th>
        <th scope="col">
            <div class="slds-truncate" title="Breed">Breed</div>
        </th>
        <th scope="col">
            <div class="slds-truncate" title="Personality">Personality</div>
        </th>
    </tr>
    </thead>
    <tbody>
    <aura:iteration items="{!v.cats}" var="cat">

    </aura:iteration>
    </tbody>
</table>
</aura:component>

and the component js controller:

({
    loadCats : function(component, event, helper) {
        var action = component.get("c.getCats");
        action.setCallback(this, function(response){
            if(response.getState()==="SUCCESS" && component.isValid()){
                component.set("v.cats",response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },
    loadNew : function(component, event, helper) {
        var loadEvent = $A.get("e.c:CatsClickEvent");
        loadEvent.setParams({"new":true});
        loadEvent.fire();
    },
})

When I add the lightning component to an app in lightning app builder it says there's no data. What am I doing wrong here?

  • you do have cat records right? your aura:component tags are missing, are you invoking the controller? – glls Jun 30 '17 at 19:32
  • I do have cat records and I'm trying to invoke the controller – Cassla Jun 30 '17 at 19:38
  • your lightning component code is incomplete, please update your post – glls Jun 30 '17 at 19:39
  • oh yeah i see now i didn't copy the whole code, will update – Cassla Jun 30 '17 at 19:42
  • 1
    Add this to your controller: ` controller="CatTrackingController"` Also, I noticed that your @AuraEnabled annotation has the wrong case - I'm not sure if it's case sensitive - but I'll give you a tip: When you write code, treat it as though it's case sensitive. Your code readability and quality will improve. Apex's case insensitivity is not blanket and it has caused a wave of bad code from people new to the platform. Don't be part of that wave. Be the surfer on it. – Caspar Harmer Jun 30 '17 at 22:54
2

You are very close to what you are trying to achieve, you need to output that data, You loaded it correctly just forgot to add the controller in the component as already suggested by @glls and then output the data inside the aura:iteration like this:

<aura:component description="CatTracking"
      implements="flexipage:availableForAllPageTypes"
      controller="CatTrackingController"
      access="global">

    <!-- more code -->
    <aura:iteration items="{!v.cats}" var="cat">
        <tr>
            <td>{!cat.Cat_Name__c}</td>
            <!-- more fields here --> 
        </tr>
    </aura:iteration>
    <!-- more code -->
</aura:component>
2

You need to invoke the controller in your lightning component, you can refer to the documentation

you will notice that the aura:component tag should have a controller attribute which should be equal to the controller name in order to invoke it.

for example:

Apex Controller:

public with sharing class MyObjController {

    @AuraEnabled
    public static List<MyObj__c> getMyObjects() {

        // Perform isAccessible() checks here 
        return [SELECT Id, Name, myField__c FROM MyObj__c];
    } }

Component:

<aura:component controller="MyObjController"/>
<aura:attribute name="myObjects" type="namespace.MyObj__c[]"/>
<aura:iteration items="{!v.myObjects}" var="obj">
    {!obj.Name}, {!obj.namespace__myField__c}
</aura:iteration>

Additionally, take notice of the iteration in the sample provided. For each cat record you have, what do you want the iteration to render in markup?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.