"Not a function" error in Lightning component during init

Question

I am new to Lightning and i am trying some basic things. I am getting this error in Preview. Pls help.

"Error during init : helper.method is not a function"

Apex Class

public class contactAura {
@AuraEnabled

public static List<Contact> getAllContacts()
{

    return [select id, name from Contact limit 5];    
}
}

component

<aura:component controller="contactAura" >
<aura:attribute name="contactRows" type="Object[]"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<div class="container">
    <p>
        <b> List of Contacts </b>
    </p>
    <table class="table table-bordered table-hover">
        <thead>
            <tr>
                <th><strong> Id </strong></th>
                <th> <strong>  Name </strong> </th>
            </tr>
        </thead>
        <tbody>
            <aura:iteration var="cell" items="{!v.contactRows}">
                <tr>
                    <td> <a href="{! '/'+cell.Id}"> {!cell.Id} </a> </td>
                    <td> {!cell.Name}  </td>
                </tr>
            </aura:iteration>
        </tbody>
    </table>
</div>
</aura:component>

Component Controller

({
doInit : function(component, event, helper) {
    helper.getAllContacts(component);
}
})

Component Helper

({
getAllContacts: function(component, event, helper){
    var action = component.get("c.getAllContacts");
    action.setCallback(this, function(a){
        component.set("v.contactRows", a.getReturnvalue());


    })

    $A.enqueueAction(action);
}
})

Application

<aura:application >
  <link href='/resource/bootstrap/' rel="stylesheet"/>
  <c:AllContactsComp />
</aura:application>

Answer 1

With a quick test of a copy/paste of this code, I found a different error:

Unknown Error : a.getReturnvalue is not a function

So above, you weren't careful with the case-sensitivity of Javascript. So with that corrected, I tried again with the following correction:

a.getReturnValue()
           ^------I made this upper case

After which point, it worked fine.

FYI, I'm not using the bootstrap CSS in mine, but that shouldn't matter.

Why the different error in your instance? Not sure. Could be the compiler in your browser's implementation of JS was failing to compile the whole helper function, instead of catching the call on the inner function. JS works in mysterious ways.

Edit: I was not clear enough, so added the code example.

Answer 2

You need to capitalize the 'v' as @Peter said. The line in your helper should look like this:

component.set("v.contactRows", a.getReturnValue());