Lightning component working alone but not working inside another component

Question

I've created a component to update "Observations__c" value in Account Object. It is working fine, but I need to call it inside another component. But inside another component, it isn't working and I don't know what am I missing.

Component sparkAccount:

<aura:component implements="force:lightningQuickActionWithoutHeader,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes" access="global" controller="getAccount">

<aura:handler name="init" action="{!c.init}" value="{!this}" />
<aura:attribute name="accounts" type="Account" />
<aura:attribute name="recordId" type="Id" />

<ltng:require styles="/resource/slds103/assets/styles/salesforce-lightning-design-system.min.css"/>

 <form>
    <ui:inputText aura:id="client"
                  label="{!$ObjectType.Account.fields.Observations__c.Label}"
                  class="form-control"
                  value="{!v.accounts.Observations__c}"
                  placeholder="Insira, caso necessário, comentários adicionais"
    />
    <br />
    <ui:button class="form-control" aura:id="button" label="Anexar observação" press="{!c.save}"/>
</form>

 </aura:component>

Controller js:

({
init : function(component, event, helper) {
    var accId = component.get("v.recordId");
    var action = component.get("c.getAcct");

    action.setParams({
        "accountId": component.get("v.recordId")
    });

    action.setCallback(this, function(data) {
        component.set("v.accounts", data.getReturnValue());
    });

    $A.enqueueAction(action);
}, 
save : function(component, event, helper) {

    var action = component.get("c.saveAcct");
    var accounts = component.get("v.accounts");

    action.setParams({"act": accounts});
    $A.enqueueAction(action);

    console.log('save ran');

}
})

Apex Controller:

public class getAccount {
    @AuraEnabled 
    public static Account getAcct(Id accountId){
        return (Account) Database.query( ' SELECT Name, Observations__c FROM Account WHERE Id =: accountId LIMIT 1 ' )[0];
    }
    @AuraEnabled 
    public static Account saveAcct(Account act){
        upsert act;
        return act;
    }  
}

I'm calling sparkAccount.cmp inside notifyClient.cmp like this:

<c:sparkAccount/>

But when I try to use it, I receive the following error: System.NullPointerException: Attempted to upsert a null list

It's not being able to get Account information I guess. Why?

Answer 1

recordId is not being set, because only top-level components will receive an Id when using force:hasRecordId, etc. Your top-level component needs to pass that information on.

<c:sparkAccount recordId="{!v.recordId}" />

---

Also, some pointers.

---

<aura:attribute name="recordId" type="Id" />

Do not define a recordId attribute if you're using any interface that provides a recordId. You can cause things to break.

---

<ltng:require styles="/resource/slds103/assets/styles/salesforce-lightning-design-system.min.css"/>

You should not import SLDS in your component; it should already be properly styled from a parent runtime.

---

<ui:inputText ...

This element doesn't style itself properly, and is deprecated. Use lightning:input instead.

---

<ui:button

This element doesn't style itself properly, and is deprecated. Use lightning:button instead.