Method Names in Lightning Component Controllers vs Apex Controllers

In the Lightning Component docs, they tell you to use the following “c.” syntax when you want to reference the Javascript controller method from the component view:

<ui:button label="Click" press="{!c.doJSMethod}" />

also in the docs, they show you how you can call an Apex method from the Javascript controller using the exact same notation:

var myAction = component.get("c.myApexControllerAction");

What they don’t tell you is to BE SURE YOU DO NOT USE THE SAME FUNCTION NAMES IN YOUR JS CONTROLLER AS YOU HAVE IN YOUR APEX CONTROLLER!!  This causes all kinds of bad behavior because while you may be trying to run an apex method, your JS controller will interpret it as your JS function instead.  In my case today, this caused an infinite loop since my function kept calling itself.

Here was my scenario.  On my Javascript controller, I had something like this:

saveAccount: function(component,event,handler){
// just like in the docs, thinking we're referencing the Apex controller...
  var action = component.get("c.saveAccount");
    acct : component.get("v.account")
    console.log('got response');
    // do callback actions.

As you can see, by setting my action to “c.saveAccount”, as it tells you in the docs, I was actually setting the action to the javascript controller method that initiated the logic in the first place instead of my Apex controller method called “saveAccount”, thus causing an infinite loop, and a bunch of time debugging what turned out to be a simple namespacing issue.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s