Apex Code Development You need to sign in to do that
Don't have an account?
Error raised while loading a ligthning component
I'm getting an error while loading a lightning component.
In an application it never works
In a Navigation Menu, it raise an error at first load but works fine after refresh of the page (F5).
The component is using design system resources, an init method and embedded components.
While debugging, i can see that my controller part is never reached even it's correctly loaded.
What can be the root cause that raise the error?
Here's my component code:
In an application it never works
In a Navigation Menu, it raise an error at first load but works fine after refresh of the page (F5).
Something has gone wrong. [NoErrorObjectAvailable] Aura.loadComponent(): Failed to initialize application. Event fired
The component is using design system resources, an init method and embedded components.
While debugging, i can see that my controller part is never reached even it's correctly loaded.
What can be the root cause that raise the error?
Here's my component code:
<aura:component controller="TockReportCtrl" implements="force:appHostable" >
<ltng:require styles="/resource/SLDS0120/assets/styles/salesforce-lightning-design-system-ltng.css" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<div class="slds">
<div class="slds-grid slds-m-around--x-small">
<div class="when slds-col slds-medium-size--1-of-3 slds-m-around--x-small">
<ui:inputSelect aura:id="when" label="When" change="{!c.changeWhen}" value="{!v.when}">
<ui:inputSelectOption text="year" label="Year"/>
<ui:inputSelectOption text="quarter" label="Quarter"/>
<ui:inputSelectOption text="month" label="Month"/>
<ui:inputSelectOption text="week" label="Week"/>
<ui:inputSelectOption text="date" label="Date"/>
</ui:inputSelect>
<div id="year" class="slds-hide slds-m-around--x-small slds-show">
<ui:inputSelect aura:id="year" value="{!v.year}" class="dynamic"/>
</div>
<div id="quarter" class="slds-hide slds-grid slds-m-around--x-small">
<div class="slds-col slds-m-around--small slds-medium-size--1-of-3">
<ui:inputSelect aura:id="quarter" value="{!v.quarter}">
<ui:inputSelectOption text="0" label="Q1"/>
<ui:inputSelectOption text="1" label="Q2"/>
<ui:inputSelectOption text="2" label="Q3"/>
<ui:inputSelectOption text="3" label="Q4"/>
</ui:inputSelect>
</div>
<div class="slds-col slds-m-around--small slds-medium-size--1-of-3">
<ui:inputSelect aura:id="quarteryear" value="{!v.quarteryear}" class="dynamic"/>
</div>
</div>
<div id="month" class="slds-hide slds-grid slds-m-around--x-small">
<div class="slds-col slds-m-around--small slds-medium-size--1-of-3">
<ui:inputSelect aura:id="month" value="{!v.month}">
<ui:inputSelectOption text="1" label="January"/>
<ui:inputSelectOption text="2" label="February"/>
<ui:inputSelectOption text="3" label="March"/>
<ui:inputSelectOption text="4" label="April"/>
<ui:inputSelectOption text="5" label="May"/>
<ui:inputSelectOption text="6" label="June"/>
<ui:inputSelectOption text="7" label="July"/>
<ui:inputSelectOption text="8" label="August"/>
<ui:inputSelectOption text="9" label="September"/>
<ui:inputSelectOption text="10" label="October"/>
<ui:inputSelectOption text="11" label="November"/>
<ui:inputSelectOption text="12" label="December"/>
</ui:inputSelect>
</div>
<div class="slds-col slds-m-around--small slds-medium-size--1-of-3">
<ui:inputSelect aura:id="monthyear" value="{!v.monthyear}" class="dynamic"/>
</div>
</div>
<div id="week" class="slds-hide slds-m-around--x-small">
<ui:inputDate label="week" aura:id="week" value="{!v.weekday}" displayDatePicker="true"/>
</div>
<div id="date" class="slds-hide slds-m-around--x-small">
<ui:inputDate label="Start Date" aura:id="startDate" displayDatePicker="true" value="{!v.startDate}"/>
<ui:inputDate label="End Date" aura:id="endDate" displayDatePicker="true" value="{!v.endDate}"/>
</div>
</div>
<div class="Who slds-col slds-medium-size--1-of-3 slds-m-around--x-small">
<ui:inputSelect aura:id="who" label="Who" change="{!c.changeWho}">
<ui:inputSelectOption text="self" label="Only me"/>
<ui:inputSelectOption text="user" label="Specific User"/>
<ui:inputSelectOption text="practice" label="Practice"/>
<ui:inputSelectOption text="team" label="Team"/>
<ui:inputSelectOption text="allusers" label="All Users"/>
</ui:inputSelect>
<div class="slds-hide" id="user">
<c:SelectItemComponent type="user" selectedItems="{!v.selectedUsers}" availableItems="{!v.availableUsers}"/>
</div>
<div class="slds-hide" id="practice">
<c:SelectItemComponent type="practice" selectedItems="{!v.selectedPractices}" availableItems="{!v.availablePractices}"/>
</div>
<div class="slds-hide" id="team">
<c:SelectItemComponent type="team" selectedItems="{!v.selectedTeams}" availableItems="{!v.availableTeams}"/>
</div>
</div>
<div class="what slds-col slds-medium-size--1-of-3 slds-m-around--x-small" id="what">
<ui:inputSelect aura:id="what" label="What" change="{!c.changeWhat}" value="{!v.what}">
<ui:inputSelectOption text="activity" label="Business Activity (All Levels)"/>
<ui:inputSelectOption text="root" label="Business Activity (Root)"/>
<ui:inputSelectOption text="projects" label="All the Project"/>
<ui:inputSelectOption text="services" label="all the Services"/>
<ui:inputSelectOption text="all" label="All the Business Activities"/>
</ui:inputSelect>
<div id="activity" class="slds-hide">
<c:SelectItemComponent type="activity" selectedItems="{!v.selectedActivities}" availableItems="{!v.availableActivities}"/>
</div>
<div id="root" class="slds-hide">
<c:SelectItemComponent type="root" selectedItems="{!v.selectedActivitiesroot}" availableItems="{!v.availableActivitiesroot}"/>
</div>
</div>
</div>
<div class="slds-grid how">
<div class="type slds-col slds-medium-size--1-of-2 slds-m-around--x-small">
<span>Type of report</span>
<div >
<div id="type"><ui:button press="{!c.synthetic}" class="{!v.synthetic_selectclass}"> Synthetic </ui:button> <ui:button press="{!c.detailled}" class="{!v.detailled_selectclass}"> Detailled </ui:button></div>
</div>
</div>
<div class="level slds-col slds-medium-size--1-of-2 slds-m-around--x-small">
<span>Type of report</span>
<div >
<div id="level"><ui:button press="{!c.sublevel}" class="{!v.sublevel_selectclass}"> Sub Level </ui:button> <ui:button press="{!c.toplevel}" class="{!v.toplevel_selectclass}"> Top Level </ui:button></div>
</div>
</div>
</div>
<ui:button label="Launch" press="{!c.getReportValue}"/>
<ui:button label="Extract" press="{!c.extractReport}"/>
<span class="red"> {!v.report.message}</span>
<table class="slds-table slds-table--bordered">
<tr class="slds-hint-parent slds-theme--shade"><td>User</td>
<td>Practice</td>
<td>Team</td>
<td class="slds-truncate">Root</td>
<td class="{!v.toplevelClass}">Level 1</td>
<td class="{!v.toplevelClass}">Level 2</td>
<td class="{!v.toplevelClass}">Activity Full Name</td>
<td>Length</td>
<td>Date</td>
<td>Comment</td></tr>
<aura:iteration items="{!v.report.lines}" var="line">
<tr class="slds-hint-parent"> <td>{!line.userName}</td>
<td>{!line.practice}</td>
<td>{!line.team}</td>
<td class="slds-truncate">{!line.rootBA}</td>
<td class="{!v.toplevelClass}">{!line.level1}</td>
<td class="{!v.toplevelClass}">{!line.level2}</td>
<td class="{!v.toplevelClass}">{!line.activityFullName}</td>
<td>{!line.length}</td>
<td>{!line.reportDate}</td>
<td>{!line.comment}</td>
</tr>
</aura:iteration>
</table>
<h1>Overtime</h1>
<table class="slds-table slds-table--bordered">
<aura:iteration items="{!v.reportOvertime}" var="line">
<tr class="slds-hint-parent"> <td>{!line.userName}</td>
<td>{!line.practice}</td>
<td>{!line.team}</td>
<td>{!line.rootBA}</td>
<td>{!line.level1}</td>
<td>{!line.level2}</td>
<td>{!line.activityFullName}</td>
<td>{!line.length}</td>
<td>{!line.reportDate}</td>
<td>{!line.comment}</td>
</tr>
</aura:iteration>
</table>
</div>
</aura:component>