-
ChatterFeed
-
0Best Answers
-
0Likes Received
-
0Likes Given
-
3Questions
-
7Replies
Issue with setting lightning:map center attribute in Summer 19 preview
Wondering if anyone else has come across this and may have a solution/suggestion. I have a customized mapping component our service people are using, and while preparing to work on something else for their interface in our sandbox I noticed that the map was throwing an error in the console when trying to set the center position: "InvalidValueError: setPosition: not a LatLng or LatLngLiteral: in property lng: not a number"
Now this is working as intended in our live environment, and I haven't done anything to this component yet. The only difference between the environments is that our sandbox was recently put on the Summer '19 preview, and I can't seem to find anything in the release notes where the specifications may have changed, but I'm at a loss for how to correct this. Regardless of how I try to set that Center attribute it throws that same error, even if I bypass the dynamic setting and hard-code a numerical value into the lat and lng attributes that I know is valid.
Here's the helper method that was previously setting the center after it called to the server to make a query:
And here is the server-side method(s) involved with getting my mapping locations:
My map pips work as intended and end up where they're supposed to be, the only problem is that the map starts centered in the middle of the Pacific thanks to that InvalidValueError, so if anyone has any suggestions on how best to address that would be appreciated.
Now this is working as intended in our live environment, and I haven't done anything to this component yet. The only difference between the environments is that our sandbox was recently put on the Summer '19 preview, and I can't seem to find anything in the release notes where the specifications may have changed, but I'm at a loss for how to correct this. Regardless of how I try to set that Center attribute it throws that same error, even if I bypass the dynamic setting and hard-code a numerical value into the lat and lng attributes that I know is valid.
Here's the helper method that was previously setting the center after it called to the server to make a query:
searchNearAccounts : function(component, event, helper){
component.set("v.locationDetails", null);
var streetAddr;
var cityAddr;
var stateAddr;
var zipAddr;
var geolocation;
var accType = component.get("v.facilityType", "v.value");
console.log('Chosen facility type: ' + accType);
var initialProcess = component.get("v.callingObject", "v.value");
console.log("callingObject for Markers: " + initialProcess);
if(initialProcess === 'contact'){
streetAddr = component.find("conStreet").get("v.value");
cityAddr = component.find("conCity").get("v.value");
stateAddr = component.find("conState").get("v.value");
zipAddr = component.find("conZip").get("v.value");
geolocation = component.get("v.contactGeo", "v.value");
}
else if(initialProcess === 'patient'){
streetAddr = component.find("ptStreet").get("v.value");
cityAddr = component.find("ptCity").get("v.value");
stateAddr = component.find("ptState").get("v.value");
zipAddr = component.find("ptZip").get("v.value");
geolocation = component.get("v.patientGeo", "v.value");
}
else{
console.log('Addressing Error');
}
console.log('streetAddr: ' + streetAddr);
console.log('cityAddr: ' + cityAddr);
console.log('stateAddr: ' + stateAddr);
console.log('zipAddr: ' + zipAddr);
console.log('geolocation: ' + geolocation);
if(geolocation !== undefined){
var action = component.get("c.getNearByAccounts");
return new Promise(function(resolve, reject){
action.setParams({
"city" : cityAddr,
"state" : stateAddr,
"zipCode" : zipAddr,
"loc" : geolocation,
"accType" : accType
});
action.setCallback(this, function(a){
var response = a.getReturnValue();
var state = a.getState();
console.log('Populate Account Markers',state);
if(component.isValid() && state !== "SUCCESS"){
console.log("Error in fetching Account Markers.");
return;
}
else{
try{
var repList = response;
if(response !== null && response !== undefined){
component.set("v.locationDetails", repList);
var mapComponent = component.find('mapComponent');
if(mapComponent && mapContainer !== undefined){
mapComponent.destroy();
}
var mapContainer = component.find('mapContainer');
if(mapContainer){
mapContainer.set("v.body", "");
}
var mapBody = mapContainer.get("v.body");
var center;
console.log();
if(cityAddr !== undefined && zipAddr !== undefined && stateAddr !== undefined && stateAddr.length === 2){
if(streetAddr === undefined){
streetAddr = '123 St';
}
center = {
location:
{
City: cityAddr,
Country: 'USA',
PostalCode: zipAddr,
State: stateAddr,
Street: streetAddr
}
};
}
else{
console.log('lat: ' + parseFloat(geolocation.split(",")[0]));
console.log('lng: ' + parseFloat(geolocation.split(",")[1]));
center =
{
location: {
'Latitude': geolocation.split(",")[0],
'Longitude': geolocation.split(",")[1]
}
};
}
console.log('Map center: ' + center);
if(center != null && center != undefined){
$A.createComponent(
"lightning:map",
{
"aura:id" : 'mapComponent',
"mapMarkers" : repList,
"zoomLevel" : 8,
"center" : center,
"markersTitle" : "Accounts"
},
function(lightningMap){
mapBody.push(lightningMap);
mapContainer.set("v.body", mapBody);
}
);
component.set("v.facilitySelectLocked", false);
var listTemp = [];
listTemp.push('--Make a Selection--');
for(var i = 0; i < response.length; i++){
if(response[i].contentCount > 0){
listTemp.push(response[i].title + ' - ' + response[i].accId);
}
}
component.set("v.selAccounts", listTemp);
if(listTemp.length > 0){
component.set("v.allowContentSearch", true);
}
else{
component.set("v.allowContentSearch", false);
}
}
}
}
catch(err){
return;
}
resolve("Resolved");
}
});
$A.enqueueAction(action);
});
}
},
And here is the server-side method(s) involved with getting my mapping locations:
@AuraEnabled(cacheable=true)
public static List<LocationMap> getNearByAccounts(String city, String state, String zipCode, string loc, string accType){
List<LocationMap> result = new List<LocationMap>();
Integer maxDistance = 100;
system.debug('city: ' + city);
system.debug('state: ' + state);
system.debug('zipCode: ' + zipCode);
system.debug('location: ' + loc);
system.debug('Facility Type: ' + accType);
string latitude = '';
string longitude = '';
try{
latitude = loc.substringBefore(',').trim();
longitude = loc.substringAfter(',').trim();
decimal lat = decimal.valueOf(latitude);
decimal lon = decimal.valueOf(longitude);
system.debug('latitude: ' + latitude);
system.debug('longitude: ' + longitude);
Location loc1 = Location.newInstance(lat, lon);
String strQueryString;
string status = 'Active';
strQueryString = 'SELECT Name, Central_Intake_Email__c, Facility_Number__c, ShippingStreet, Shipping_Geolocation__Latitude__s, Shipping_Geolocation__Longitude__s, ShippingCity, ShippingState, ShippingCountry, Type, Phone, ShippingPostalCode FROM Account WHERE RecordTypeId = : accountCenter AND Type != null AND Status__c=: status';
if(accType != '' && accType != '--None--' && accType != null){
strQueryString += ' AND Type =: accType';
}
if(city != '' || zipCode != '' ){
strQueryString += ' AND DISTANCE(Shipping_Geolocation__c, GEOLOCATION(' + latitude + ',' + longitude + '), \'mi\') < '+ maxDistance+
' ORDER BY DISTANCE(Shipping_Geolocation__c, GEOLOCATION(' + latitude + ',' + longitude + '), \'mi\') limit 250';
}
else if(state != ''){
strQueryString +=' AND ShippingState = : state ORDER BY DISTANCE(Shipping_Geolocation__c, GEOLOCATION(' + latitude + ',' + longitude + '), \'mi\') ASC limit 250';
}
system.debug('query: ' + strQueryString);
List<Account> accounts = new List<Account>();
if(!test.isRunningTest()){
accounts = Database.query(strQueryString);
}
else{
accounts = AA_UtilityClass.getTestList;
}
system.debug('Accounts: ' + accounts);
list<ID> accIDs = new list<ID>();
for(Account a: accounts){
accIDs.add(a.ID);
}
map<ID, Integer> accContentMap = new map<ID, Integer>();
for(AggregateResult agrA : [SELECT COUNT(Id) countIds,
Center__c accID
FROM ContentVersion
WHERE Center__c IN:accIDs
AND IsLatest = true
AND FileType In ('MP4','PDF')
Group By Center__c
]){
accContentMap.put(string.valueOf(agrA.get('accID')), integer.valueOf(agrA.get('countIds')));
}
for(Account acc :accounts){
GeoLocation geoInfo = new GeoLocation();
geoInfo.street = acc.ShippingStreet;
geoInfo.postalCode = acc.ShippingPostalCode;
geoInfo.city = acc.ShippingCity;
geoInfo.state = acc.ShippingState;
geoInfo.country = 'USA';
geoInfo.latitude = acc.Shipping_Geolocation__Latitude__s;
geoInfo.longitude = acc.Shipping_Geolocation__Longitude__s;
LocationMap locDetail = new LocationMap();
Location loc2 = Location.newInstance(acc.Shipping_Geolocation__Latitude__s, acc.Shipping_Geolocation__Longitude__s);
decimal dist = Location.getDistance(loc1, loc2, 'mi');
dist = dist.setScale(2);
locDetail.icon = 'standard:account';
locDetail.title = acc.Name + ': ' + acc.Facility_Number__c;
locDetail.description = acc.ShippingStreet + ' ' +
acc.ShippingCity + ', ' + acc.ShippingState + ' ' + acc.ShippingPostalCode;
locDetail.street = acc.ShippingStreet;
locDetail.city = acc.ShippingCity;
locDetail.state = acc.ShippingState;
locDetail.zip = acc.ShippingPostalCode;
locDetail.dist = dist + ' mi';
locDetail.accType = acc.Type;
if(acc.Phone != null){
locDetail.phone = acc.Phone;
}
locDetail.contentCount = 0;
if(accContentMap.get(acc.ID) != null){
locDetail.contentCount = accContentMap.get(acc.ID);
}
locDetail.accId = acc.Id;
locDetail.location = geoInfo;
result.add(locDetail);
}
system.debug('mapPips: ' + result);
return result;
}
catch(Exception e){
system.debug('Error: ' + e.getMessage() + ' Line: ' + e.getLineNumber());
return null;
}
}
public class LocationMap{
@AuraEnabled
public String icon {get;set;}
@AuraEnabled
public String title {get;set;}
@AuraEnabled
public String description {get;set;}
@AuraEnabled
public String street {get;set;}
@AuraEnabled
public String city {get;set;}
@AuraEnabled
public String state {get;set;}
@AuraEnabled
public String zip {get;set;}
@AuraEnabled
public String phone {get;set;}
@AuraEnabled
public String dist {get;set;}
@AuraEnabled
public GeoLocation location {get;set;}
@AuraEnabled
public integer contentCount {get;set;}
@AuraEnabled
public string accId {get;set;}
@AuraEnabled
public string accType {get;set;}
}
public class GeoLocation{
@AuraEnabled
public String Street {get;set;}
@AuraEnabled
public String PostalCode {get;set;}
@AuraEnabled
public String City {get;set;}
@AuraEnabled
public String State {get;set;}
@AuraEnabled
public String country {get;set;}
@AuraEnabled
public decimal Latitude {get;set;}
@AuraEnabled
public decimal Longitude {get;set;}
}
My map pips work as intended and end up where they're supposed to be, the only problem is that the map starts centered in the middle of the Pacific thanks to that InvalidValueError, so if anyone has any suggestions on how best to address that would be appreciated.
-
- CMielczarski
- May 09, 2019
- Like
- 0
Need help getting value to pass to server-side controller in lightning components
I'm having some trouble with passing date variables to my server-side controller for some reason. All the other variables transfer in my action call, and my console logging confirms there is a value present, but they only register as null in the controller.
My issue lies with getting this controller method to accept the two date parameters for whatever reason:
DashboardEvent:
Dashboard Controller:
Dashboard helper:
VisualCharts component:
VisualCharts controller:
VisualCharts Helper
If anyone could provide any guidance that would really be appreciated, I've been banging my head against this for longer than I'd like but can't seem to determine what I'm missing.
Thanks.
My issue lies with getting this controller method to accept the two date parameters for whatever reason:
@AuraEnabled
public static string getReportVals(string selRole, string selRoleName, string selReport, Date dteFrom, Date dteTo) {
system.debug('SelRole value: ' + selRole);
system.debug('SelRoleName value: ' + selRoleName);
system.debug('SelReport value: ' + selReport);
system.debug('DteFrom value: ' + dteFrom);
system.debug('DteTo value: ' + dteTo);
String JsonString ;
//calls the method based on selReport value and assigns result to JsonString.
if(selReport == 'Accounts without Activity for 30 days'){
JsonString = getAccountWithoutActivity(selRole, selRoleName);
}
else if(selReport == 'PD Monthly Meeting' || selReport == 'QBR Tracking'){
JsonString = getDashboardData(selRole, selRoleName, selReport);
}
else if(selReport == 'Risk Account'){
JsonString = getRiskAccount(selRole, selRoleName);
}
return JsonString;
}
DashboardEvent:
<aura:event type="APPLICATION">
<aura:attribute name="selRole" type="String" />
<aura:attribute name="selReport" type="String"/>
<aura:attribute name="selRoleName" type="String"/>
<aura:attribute name="dteFrom" type="Date"/>
<aura:attribute name="dteTo" type="Date"/>
</aura:ev
Dashboard Component:
<aura:component controller="TBN_Dashboard" access="global" implements="flexipage:availableForAllPageTypes">
<ltng:require styles="/resource/SLDSv213/assets/styles/salesforce-lightning-design-system.css"/>
<aura:attribute name="selRoles" type="String[]" />
<aura:attribute name="selRoleList" type="String[]" />
<aura:attribute name="selReports" type="String[]" />
<aura:attribute name="dteTo" type="Date" />
<aura:attribute name="dteFrom" type="Date" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:registerEvent name="DashboardEvent" type="c:DashboardEvent"/>
<div class="slds" style="min-height: 500px; max-width:1300px; width:1300px;">
<div class="slds-grid paddingTop">
<div style="max-width:90%">
<div class=" slds-text-align--left">
<div class="slds-grid">
<div class="slds-col">
<div class="slds-form-element roleDiv" style="min-width: 110px">
<div class="slds-form-element__label">Level: </div>
<div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRole" change="{!c.onRoleChange}" >
<aura:iteration items="{!v.selRoles}" var="roleName">
<ui:inputSelectOption text="{!roleName}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element hierarchyDiv paddingleft" style="min-width: 170px">
<div class="slds-form-element__label">Role Hierarchy: </div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRoleHierarchy" change="{!c.onRoleHierarchyChange}" disabled="true">
<aura:iteration items="{!v.selRoleList}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 270px">
<div class="slds-form-element__label">Dashboard:</div>
<div>
<ui:inputSelect class="slds-select" change="{!c.onReportChange}" aura:id="InputSelectReport">
<aura:iteration items="{!v.selReports}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date from:</label>
<div class="slds-form-element__control">
<ui:inputDate aura:id="InputDateFrom" class="slds-input" value="{!v.dteFrom}"
/>
</div>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date to:</label>
<div class="slds-form-element__control">
<ui:inputDate aura:id="InputDateTo" class="slds-input" value="{!v.dteTo}"
/>
</div>
</div>
</div>
</div>
<div class="slds-col paddingleft paddingTop">
<div class="slds-form-element">
<lightning:button aura:id="searchButton" label="Go" onclick="{!c.showChart}"/>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="Charts">
<c:TBN_VisualCharts />
</div>
</div>
</aura:component>
Dashboard Controller:
({
doInit : function(component, event, helper) {
helper.getRole(component);
helper.getReport(component);
component.find("InputSelectRole").set("v.value", 'National'),
component.find("InputSelectReport").set("v.value", 'Accounts without Activity for 30 days'),
component.find("InputSelectRoleHierarchy").set("v.value", '--None Selected--'),
},
showChart : function(component, event, helper) {
// helper.toggleSpinner(component);
//press="{!c.toggleSpinner}"
// helper.loading(component);
var inputCmp = component.find("InputSelectRoleHierarchy");
if(component.find("InputSelectRole").get("v.value") != 'National' && (component.find("InputSelectRoleHierarchy").get("v.value") == '--None Selected--' || component.find("InputSelectRoleHierarchy").get("v.value") == null)){
console.log('>>>>>>>');
inputCmp.set("v.errors", [{message:"Please select picklist value "}]);
}
else{
inputCmp.set("v.errors", null);
//helper.showChartData(component);
console.log('=======here----1---');
var appEvent = $A.get("e.c:DashboardEvent");
appEvent.setParams({
"selRole" : component.find("InputSelectRole").get("v.value"),
"selReport" : component.find("InputSelectReport").get("v.value"),
"selRoleName" : component.find("InputSelectRoleHierarchy").get("v.value"),
"dteFrom": component.find("InputDateFrom").get("v.value"),
"dteTo": component.find("InputDateTo").get("v.value")
});
appEvent.fire();
}
},
onRoleChange : function(component, event, helper) {
helper.disableSelectRole(component);
helper.getRoleNamePicklist(component);
},
onRoleHierarchyChange : function(component, event){
var inputSelReport = component.find("InputSelectReport");
setTimeout(function(){ inputSelReport.focus(); }, 20);
},
onReportChange : function(component, event){
var searchbutton = component.find("searchButton");
setTimeout(function(){ searchbutton.focus(); }, 20);
}
})
Dashboard helper:
({
getRole : function(component) {
var action = component.get("c.getRoleNames");
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoles", stringItems);
component.set("v.selRoleList", '--None Selected--');
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
getReport : function(component){
var action1 = component.get("c.getReportNames");
action1.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state====1==',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selReports", stringItems);
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action1);
},
getRoleNamePicklist : function(component){
//this.disableSelectRole(component, event);
var action = component.get("c.getRoles");
var InputSelectRole = component.find("InputSelectRole").get("v.value");
action.setParams({
"selRole" : component.find("InputSelectRole").get("v.value")
});
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoleList", stringItems);
var selRole =component.find("InputSelectRoleHierarchy");
selRole.set("v.value", "--None Selected--");
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
disableSelectRole : function(component){
var inputSelReport = component.find("InputSelectReport");
var inputSel = component.find("InputSelectRoleHierarchy");
var searchbutton = component.find("searchButton");
if(component.find("InputSelectRole").get("v.value") == 'National'){
inputSel.set("v.disabled", true);
setTimeout(function(){ inputSelReport.focus(); }, 20);
}
else{
inputSel.set("v.disabled",false);
setTimeout(function(){ inputSel.focus(); }, 20);
}
}
})
VisualCharts component:
<aura:component controller="TBN_VisualChartController" access="global" implements="flexipage:availableForAllPageTypes" description="The component to draw various charts using Chart.js Library. Refer to http://www.chartjs.org/ for the library detail.">
<aura:attribute name="chartTitle" type="String" access="global"/>
<aura:attribute name="chart" type="Object" access="public" description="A chart instance to refer to chart"/>
<aura:attribute name="chartLegend" type="Object" access="public" description="An object for chart legends"/>
<aura:attribute name="chartData" access="public" type="string" description="Chart data in JSON format. This attribute is optional. If this is not set, Chartjs Component retrieve latest data by itself." />
<aura:attribute name="chartlstData" access="public" type="string[]"/>
<aura:attribute name="chartlstCount" access="public" type="integer"/>
<aura:handler name="init" value="{!this}" action="{!c.createChart1}" description="Initialization process." />
<aura:handler event="c:DashboardEvent" action="{!c.handleComponentEvent}" />
<div class="slds-grid slds-wrap">
<aura:iteration items="{!v.chartlstData}" var="var">
<div class="slds-col slds-size--1-of-2">
<div class="slds-form-element__label reportLable" >{!var.label}</div>
<c:TBN_Chart chartTitle="{!var.label}" chartData="{!var.lstSNFRatio}"/>
</div>
</aura:iteration>
</div>
</aura:component>
VisualCharts controller:
({
handleComponentEvent : function(component, event, helper){
helper.reportData(component, event);
},
// Load data from Apex Data Provider and draw chart.
createChart1 : function(component, event, helper) {
var action = component.get("c.getReportVals");
action.setParams({
"selRole" : 'National',
"selReport" : 'Accounts without Activity for 30 days',
"selRoleName" : '',
});
action.setCallback(this, function(a){
var response = a.getReturnValue();
if (response == null || response == "" || response == "[]" || response == "{}"){
//Show toast Error
return;
}
else {
var repList = JSON.parse(response);
component.set("v.chartlstData", repList);
component.set("v.chartTitle", repList[0].label);
component.set("v.chartData", repList[0].lstSNFRatio);
}
});
$A.enqueueAction(action);
}
})
VisualCharts Helper
({
// Draw chart using chart.js.
// If chart instance already exists, it will be destroyed and re-created.
reportData : function(component, event){
var action = component.get("c.getReportVals");
action.setParams({
"selRole" : event.getParam("selRole"),
"selReport" : event.getParam("selReport"),
"selRoleName" : event.getParam("selRoleName"),
"dteFrom" : event.getParam("dteFrom"),
"dteTo" : event.getParam("dteTo")
});
action.setCallback(this, function(a){
var response = a.getReturnValue();
if (response == null || response == "" || response == "[]" || response == "{}"){
var msgId = component.find("uiMessageid");
$A.util.addClass(msgId, 'toggle');
//Show toast Error
return;
}
else{
var arr = [];
var repList = JSON.parse(response);
component.set("v.chartlstCount", repList.length);
for(var i = 0; i < repList.length; i++){
//this.drawChart(component, JSON.parse(response));
var lstRep = repList[i].lstSNFRatio;
component.set("v.chartTitle", repList[i].label);
component.set("v.chartData", lstRep);
arr.push(repList[i]);
// arr.push(lstRep);
}
component.set("v.chartlstData", arr);
}
});
$A.enqueueAction(action);
}
})
If anyone could provide any guidance that would really be appreciated, I've been banging my head against this for longer than I'd like but can't seem to determine what I'm missing.
Thanks.
-
- CMielczarski
- June 21, 2017
- Like
- 0
Need help fixing lightning component
I'm pretty new to lightning and working on adjusting an existing lightning component bundle, but I'm stuck against an issue I can't seem to work my way around.
Essentially what I need to do is pull in two optional user supplied date values to the server-side controller so I can use it to filter query results, yet apparently I'm not passing them correctly, because each time I run a test my debug statements come back that they're null.
Markup:
Thanks.
Essentially what I need to do is pull in two optional user supplied date values to the server-side controller so I can use it to filter query results, yet apparently I'm not passing them correctly, because each time I run a test my debug statements come back that they're null.
Markup:
<aura:component controller="TBN_Dashboard" access="global" implements="flexipage:availableForAllPageTypes">
<ltng:require styles="/resource/SLDSv213/assets/styles/salesforce-lightning-design-system.css"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:registerEvent name="DashboardEvent" type="c:DashboardEvent"/>
<aura:attribute name="selRoles" type="String[]" />
<aura:attribute name="selRoleList" type="String[]" />
<aura:attribute name="selReports" type="String[]" />
<aura:attribute name="dteTo" type="String" />
<aura:attribute name="dteFrom" type="String" />
<div class="slds" style="min-height: 500px; max-width:1300px; width:1300px;">
<div class="slds-grid paddingTop">
<div style="max-width:90%">
<div class=" slds-text-align--left">
<div class="slds-grid">
<div class="slds-col">
<div class="slds-form-element roleDiv" style="min-width: 110px">
<div class="slds-form-element__label">Level: </div>
<div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRole" change="{!c.onRoleChange}" >
<aura:iteration items="{!v.selRoles}" var="roleName">
<ui:inputSelectOption text="{!roleName}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element hierarchyDiv paddingleft" style="min-width: 170px">
<div class="slds-form-element__label">Role Hierarchy: </div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRoleHierarchy" change="{!c.onRoleHierarchyChange}" disabled="true">
<aura:iteration items="{!v.selRoleList}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 270px">
<div class="slds-form-element__label">Dashboard:</div>
<div>
<ui:inputSelect class="slds-select" change="{!c.onReportChange}" aura:id="InputSelectReport">
<aura:iteration items="{!v.selReports}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date from:</label>
<div class="slds-form-element__control">
<ui:inputText aura:id="InputDateFrom" class="slds-input" value="{!v.dteFrom}"
placeholder="Choose a starting date Ex:(7/1/17)" />
</div>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date to:</label>
<div class="slds-form-element__control">
<ui:inputText aura:id="InputDateTo" class="slds-input" value="{!v.dteTo}"
placeholder="Choose a starting date Ex:(7/1/17)" />
</div>
</div>
</div>
</div>
<div class="slds-col paddingleft paddingTop">
<div class="slds-form-element">
<lightning:button aura:id="searchButton" label="Go" onclick="{!c.showChart}"/>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="Charts">
<c:TBN_VisualCharts />
</div>
</div>
</aura:component>
Controller:
({
doInit : function(component, event, helper) {
helper.getRole(component);
helper.getReport(component);
component.find("InputSelectRole").set("v.value", 'National'),
component.find("InputSelectReport").set("v.value", 'Accounts without Activity for 30 days'),
component.find("InputSelectRoleHierarchy").set("v.value", '--None Selected--')
},
showChart : function(component, event, helper) {
var inputCmp = component.find("InputSelectRoleHierarchy");
if(component.find("InputSelectRole").get("v.value") != 'National' && (component.find("InputSelectRoleHierarchy").get("v.value") == '--None Selected--' || component.find("InputSelectRoleHierarchy").get("v.value") == null)){
console.log('>>>>>>>');
inputCmp.set("v.errors", [{message:"Please select picklist value "}]);
}
else{
inputCmp.set("v.errors", null);
console.log('=======here----1---');
var appEvent = $A.get("e.c:DashboardEvent");
appEvent.setParams({
"selRole" : component.find("InputSelectRole").get("v.value"),
"selReport" : component.find("InputSelectReport").get("v.value"),
"selRoleName" : component.find("InputSelectRoleHierarchy").get("v.value"),
"dteFrom" : component.find("InputDateFrom").get("v.value"),
"dteTo" : component.find("InputDateTo").get("v.value")
});
appEvent.fire();
}
},
onRoleChange : function(component, event, helper) {
helper.disableSelectRole(component);
helper.getRoleNamePicklist(component);
},
onRoleHierarchyChange : function(component, event){
var inputSelReport = component.find("InputSelectReport");
setTimeout(function(){ inputSelReport.focus(); }, 20);
},
onReportChange : function(component, event){
var searchbutton = component.find("searchButton");
setTimeout(function(){ searchbutton.focus(); }, 20);
}
})
Helper:
({
getRole : function(component) {
var action = component.get("c.getRoleNames");
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoles", stringItems);
component.set("v.selRoleList", '--None Selected--');
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
getReport : function(component){
var action1 = component.get("c.getReportNames");
action1.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state====1==',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selReports", stringItems);
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action1);
},
getRoleNamePicklist : function(component){
//this.disableSelectRole(component, event);
var action = component.get("c.getRoles");
var InputSelectRole = component.find("InputSelectRole").get("v.value");
action.setParams({
"selRole" : component.find("InputSelectRole").get("v.value")
});
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoleList", stringItems);
var selRole =component.find("InputSelectRoleHierarchy");
selRole.set("v.value", "--None Selected--");
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
disableSelectRole : function(component){
var inputSelReport = component.find("InputSelectReport");
var inputSel = component.find("InputSelectRoleHierarchy");
var searchbutton = component.find("searchButton");
if(component.find("InputSelectRole").get("v.value") == 'National'){
inputSel.set("v.disabled", true);
setTimeout(function(){ inputSelReport.focus(); }, 20);
}
else{
inputSel.set("v.disabled",false);
setTimeout(function(){ inputSel.focus(); }, 20);
}
}
})
Apex Controller method:
@AuraEnabled
public static string getReportVals(string selRole, string selRoleName, string selReport, String dteFrom, String dteTo) {
try{
date dateFromFilter = date.parse(dteFrom);
}
catch(Exception ex){
system.debug('Parse error or no date entered: ' + dteFrom);
}
try{
date dateToFilter = date.parse(dteTo);
}
catch(Exception ex){
system.debug('Parse error or no date entered: ' + dteTo);
}
String JsonString ;
//calls the method based on selReport value and assigns result to JsonString.
if(selReport == 'Accounts without Activity for 30 days'){
JsonString = getAccountWithoutActivity(selRole, selRoleName);
}
else if(selReport == 'PD Monthly Meeting' || selReport == 'QBR Tracking'){
JsonString = getDashboardData(selRole, selRoleName, selReport);
}
else if(selReport == 'Risk Account'){
JsonString = getRiskAccount(selRole, selRoleName);
}
return JsonString;
}
Everything else is working as intended, it's just when I'm trying to pass those dteFrom and dteTo variables in the controller method that I'm hitting a snag, so any help would be appreciated.Thanks.
-
- CMielczarski
- June 16, 2017
- Like
- 0
Need help getting value to pass to server-side controller in lightning components
I'm having some trouble with passing date variables to my server-side controller for some reason. All the other variables transfer in my action call, and my console logging confirms there is a value present, but they only register as null in the controller.
My issue lies with getting this controller method to accept the two date parameters for whatever reason:
DashboardEvent:
Dashboard Controller:
Dashboard helper:
VisualCharts component:
VisualCharts controller:
VisualCharts Helper
If anyone could provide any guidance that would really be appreciated, I've been banging my head against this for longer than I'd like but can't seem to determine what I'm missing.
Thanks.
My issue lies with getting this controller method to accept the two date parameters for whatever reason:
@AuraEnabled
public static string getReportVals(string selRole, string selRoleName, string selReport, Date dteFrom, Date dteTo) {
system.debug('SelRole value: ' + selRole);
system.debug('SelRoleName value: ' + selRoleName);
system.debug('SelReport value: ' + selReport);
system.debug('DteFrom value: ' + dteFrom);
system.debug('DteTo value: ' + dteTo);
String JsonString ;
//calls the method based on selReport value and assigns result to JsonString.
if(selReport == 'Accounts without Activity for 30 days'){
JsonString = getAccountWithoutActivity(selRole, selRoleName);
}
else if(selReport == 'PD Monthly Meeting' || selReport == 'QBR Tracking'){
JsonString = getDashboardData(selRole, selRoleName, selReport);
}
else if(selReport == 'Risk Account'){
JsonString = getRiskAccount(selRole, selRoleName);
}
return JsonString;
}
DashboardEvent:
<aura:event type="APPLICATION">
<aura:attribute name="selRole" type="String" />
<aura:attribute name="selReport" type="String"/>
<aura:attribute name="selRoleName" type="String"/>
<aura:attribute name="dteFrom" type="Date"/>
<aura:attribute name="dteTo" type="Date"/>
</aura:ev
Dashboard Component:
<aura:component controller="TBN_Dashboard" access="global" implements="flexipage:availableForAllPageTypes">
<ltng:require styles="/resource/SLDSv213/assets/styles/salesforce-lightning-design-system.css"/>
<aura:attribute name="selRoles" type="String[]" />
<aura:attribute name="selRoleList" type="String[]" />
<aura:attribute name="selReports" type="String[]" />
<aura:attribute name="dteTo" type="Date" />
<aura:attribute name="dteFrom" type="Date" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:registerEvent name="DashboardEvent" type="c:DashboardEvent"/>
<div class="slds" style="min-height: 500px; max-width:1300px; width:1300px;">
<div class="slds-grid paddingTop">
<div style="max-width:90%">
<div class=" slds-text-align--left">
<div class="slds-grid">
<div class="slds-col">
<div class="slds-form-element roleDiv" style="min-width: 110px">
<div class="slds-form-element__label">Level: </div>
<div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRole" change="{!c.onRoleChange}" >
<aura:iteration items="{!v.selRoles}" var="roleName">
<ui:inputSelectOption text="{!roleName}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element hierarchyDiv paddingleft" style="min-width: 170px">
<div class="slds-form-element__label">Role Hierarchy: </div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRoleHierarchy" change="{!c.onRoleHierarchyChange}" disabled="true">
<aura:iteration items="{!v.selRoleList}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 270px">
<div class="slds-form-element__label">Dashboard:</div>
<div>
<ui:inputSelect class="slds-select" change="{!c.onReportChange}" aura:id="InputSelectReport">
<aura:iteration items="{!v.selReports}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date from:</label>
<div class="slds-form-element__control">
<ui:inputDate aura:id="InputDateFrom" class="slds-input" value="{!v.dteFrom}"
/>
</div>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date to:</label>
<div class="slds-form-element__control">
<ui:inputDate aura:id="InputDateTo" class="slds-input" value="{!v.dteTo}"
/>
</div>
</div>
</div>
</div>
<div class="slds-col paddingleft paddingTop">
<div class="slds-form-element">
<lightning:button aura:id="searchButton" label="Go" onclick="{!c.showChart}"/>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="Charts">
<c:TBN_VisualCharts />
</div>
</div>
</aura:component>
Dashboard Controller:
({
doInit : function(component, event, helper) {
helper.getRole(component);
helper.getReport(component);
component.find("InputSelectRole").set("v.value", 'National'),
component.find("InputSelectReport").set("v.value", 'Accounts without Activity for 30 days'),
component.find("InputSelectRoleHierarchy").set("v.value", '--None Selected--'),
},
showChart : function(component, event, helper) {
// helper.toggleSpinner(component);
//press="{!c.toggleSpinner}"
// helper.loading(component);
var inputCmp = component.find("InputSelectRoleHierarchy");
if(component.find("InputSelectRole").get("v.value") != 'National' && (component.find("InputSelectRoleHierarchy").get("v.value") == '--None Selected--' || component.find("InputSelectRoleHierarchy").get("v.value") == null)){
console.log('>>>>>>>');
inputCmp.set("v.errors", [{message:"Please select picklist value "}]);
}
else{
inputCmp.set("v.errors", null);
//helper.showChartData(component);
console.log('=======here----1---');
var appEvent = $A.get("e.c:DashboardEvent");
appEvent.setParams({
"selRole" : component.find("InputSelectRole").get("v.value"),
"selReport" : component.find("InputSelectReport").get("v.value"),
"selRoleName" : component.find("InputSelectRoleHierarchy").get("v.value"),
"dteFrom": component.find("InputDateFrom").get("v.value"),
"dteTo": component.find("InputDateTo").get("v.value")
});
appEvent.fire();
}
},
onRoleChange : function(component, event, helper) {
helper.disableSelectRole(component);
helper.getRoleNamePicklist(component);
},
onRoleHierarchyChange : function(component, event){
var inputSelReport = component.find("InputSelectReport");
setTimeout(function(){ inputSelReport.focus(); }, 20);
},
onReportChange : function(component, event){
var searchbutton = component.find("searchButton");
setTimeout(function(){ searchbutton.focus(); }, 20);
}
})
Dashboard helper:
({
getRole : function(component) {
var action = component.get("c.getRoleNames");
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoles", stringItems);
component.set("v.selRoleList", '--None Selected--');
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
getReport : function(component){
var action1 = component.get("c.getReportNames");
action1.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state====1==',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selReports", stringItems);
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action1);
},
getRoleNamePicklist : function(component){
//this.disableSelectRole(component, event);
var action = component.get("c.getRoles");
var InputSelectRole = component.find("InputSelectRole").get("v.value");
action.setParams({
"selRole" : component.find("InputSelectRole").get("v.value")
});
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoleList", stringItems);
var selRole =component.find("InputSelectRoleHierarchy");
selRole.set("v.value", "--None Selected--");
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
disableSelectRole : function(component){
var inputSelReport = component.find("InputSelectReport");
var inputSel = component.find("InputSelectRoleHierarchy");
var searchbutton = component.find("searchButton");
if(component.find("InputSelectRole").get("v.value") == 'National'){
inputSel.set("v.disabled", true);
setTimeout(function(){ inputSelReport.focus(); }, 20);
}
else{
inputSel.set("v.disabled",false);
setTimeout(function(){ inputSel.focus(); }, 20);
}
}
})
VisualCharts component:
<aura:component controller="TBN_VisualChartController" access="global" implements="flexipage:availableForAllPageTypes" description="The component to draw various charts using Chart.js Library. Refer to http://www.chartjs.org/ for the library detail.">
<aura:attribute name="chartTitle" type="String" access="global"/>
<aura:attribute name="chart" type="Object" access="public" description="A chart instance to refer to chart"/>
<aura:attribute name="chartLegend" type="Object" access="public" description="An object for chart legends"/>
<aura:attribute name="chartData" access="public" type="string" description="Chart data in JSON format. This attribute is optional. If this is not set, Chartjs Component retrieve latest data by itself." />
<aura:attribute name="chartlstData" access="public" type="string[]"/>
<aura:attribute name="chartlstCount" access="public" type="integer"/>
<aura:handler name="init" value="{!this}" action="{!c.createChart1}" description="Initialization process." />
<aura:handler event="c:DashboardEvent" action="{!c.handleComponentEvent}" />
<div class="slds-grid slds-wrap">
<aura:iteration items="{!v.chartlstData}" var="var">
<div class="slds-col slds-size--1-of-2">
<div class="slds-form-element__label reportLable" >{!var.label}</div>
<c:TBN_Chart chartTitle="{!var.label}" chartData="{!var.lstSNFRatio}"/>
</div>
</aura:iteration>
</div>
</aura:component>
VisualCharts controller:
({
handleComponentEvent : function(component, event, helper){
helper.reportData(component, event);
},
// Load data from Apex Data Provider and draw chart.
createChart1 : function(component, event, helper) {
var action = component.get("c.getReportVals");
action.setParams({
"selRole" : 'National',
"selReport" : 'Accounts without Activity for 30 days',
"selRoleName" : '',
});
action.setCallback(this, function(a){
var response = a.getReturnValue();
if (response == null || response == "" || response == "[]" || response == "{}"){
//Show toast Error
return;
}
else {
var repList = JSON.parse(response);
component.set("v.chartlstData", repList);
component.set("v.chartTitle", repList[0].label);
component.set("v.chartData", repList[0].lstSNFRatio);
}
});
$A.enqueueAction(action);
}
})
VisualCharts Helper
({
// Draw chart using chart.js.
// If chart instance already exists, it will be destroyed and re-created.
reportData : function(component, event){
var action = component.get("c.getReportVals");
action.setParams({
"selRole" : event.getParam("selRole"),
"selReport" : event.getParam("selReport"),
"selRoleName" : event.getParam("selRoleName"),
"dteFrom" : event.getParam("dteFrom"),
"dteTo" : event.getParam("dteTo")
});
action.setCallback(this, function(a){
var response = a.getReturnValue();
if (response == null || response == "" || response == "[]" || response == "{}"){
var msgId = component.find("uiMessageid");
$A.util.addClass(msgId, 'toggle');
//Show toast Error
return;
}
else{
var arr = [];
var repList = JSON.parse(response);
component.set("v.chartlstCount", repList.length);
for(var i = 0; i < repList.length; i++){
//this.drawChart(component, JSON.parse(response));
var lstRep = repList[i].lstSNFRatio;
component.set("v.chartTitle", repList[i].label);
component.set("v.chartData", lstRep);
arr.push(repList[i]);
// arr.push(lstRep);
}
component.set("v.chartlstData", arr);
}
});
$A.enqueueAction(action);
}
})
If anyone could provide any guidance that would really be appreciated, I've been banging my head against this for longer than I'd like but can't seem to determine what I'm missing.
Thanks.
- CMielczarski
- June 21, 2017
- Like
- 0
I need to talk to a developer about our quote template. SF Support suggested I ask here.
On our Quote template "EAP Quote" we need the field "Qty" header in the gray bar to read "Mo Qty" and the "Total Price" field to read "Total Mo Price." In the totals area, I need to change the field labeled "Total Sales Price" to 'Total Mo Price" and "Grand Total" to read "Mo Grand Total." All four fields need to behave as they do now. Is this possible? If so, how do I proceed with hiring a developer?
Ellen
Ellen
- Ellen Martin
- June 20, 2017
- Like
- 0
Lightning Data Service Trailhead Challenge Error (Manipulate Records with force:recordData)
Hi Can some one explain me how to use two components with Lightning Data Service, i tried the following code for accDisplay and accEdit.
This worked as i expected but i got the following error!
I am missing some thing, can some one explain me how LDS works with multiple componets!
This worked as i expected but i got the following error!
I am missing some thing, can some one explain me how LDS works with multiple componets!
Challenge Not yet complete... here's what's wrong: The 'accDisplay' Lightning Component does not appear to be displaying the 'Name' using 'ui:outputText' and the value 'v.accountRecord.Name
<!--accDisplay component-->
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId">
<aura:attribute name="accountRecord" type="Object" />
<force:recordData aura:id="AccountRecordCreator"
recordId="{!v.recordId}"
layoutType="FULL"
targetRecord="{!v.accountRecord}"
targetFields="{!v.simpleNewAccount}"
targetError="{!v.newContactError}"
mode="VIEW"
/>
<!-- Display a header with details about the record -->
<div class="slds-form--stacked">
<div class="slds-form-element">
<label class="slds-form-element__label" for="recordName">Name: </label>
<div class="slds-form-element__control">
<ui:outputText class="slds-input" aura:id="recordName"
value="{!v.simpleNewAccount.Name}" />
</div>
<label class="slds-form-element__label" for="recordIndustry">Industry: </label>
<div class="slds-form-element__control">
<ui:outputText class="slds-input" aura:id="recordIndustry"
value="{!v.simpleNewAccount.Industry}" />
</div>
<label class="slds-form-element__label" for="recordDescription">Description: </label>
<div class="slds-form-element__control">
<ui:outputTextArea class="slds-input" aura:id="recordDescription"
value="{!v.simpleNewAccount.Description}" />
</div>
<label class="slds-form-element__label" for="recordPhone">Phone: </label>
<div class="slds-form-element__control">
<ui:outputPhone class="slds-input" aura:id="recordPhone"
value="{!v.simpleNewAccount.Phone}" />
</div>
</div>
</div>
</aura:component>
<!--accEdit-->
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId">
<aura:attribute name="accountRecord" type="Object"/>
<aura:attribute name="simpleNewAccount" type="Object"/>
<aura:attribute name="newContactError" type="String"/>
<force:recordData aura:id="AccountRecordCreator"
recordId="{!v.recordId}"
layoutType="FULL"
targetRecord="{!v.accountRecord}"
targetFields="{!v.simpleNewAccount}"
targetError="{!v.newContactError}"
mode="EDIT"
/>
<ui:outputText class="slds-output"
value="Edit Account" />
<lightning:input aura:id="recordName" name="accountRecord" label="Name"
value="{!v.simpleNewAccount.Name}" />
<lightning:button label="Save Account" onclick="{!c.handleSaveRecord}"
variant="brand" class="slds-m-top--medium"/>
</aura:component>
- Akhilesh Reddy Baddigam
- June 19, 2017
- Like
- 0
Need help fixing lightning component
I'm pretty new to lightning and working on adjusting an existing lightning component bundle, but I'm stuck against an issue I can't seem to work my way around.
Essentially what I need to do is pull in two optional user supplied date values to the server-side controller so I can use it to filter query results, yet apparently I'm not passing them correctly, because each time I run a test my debug statements come back that they're null.
Markup:
Thanks.
Essentially what I need to do is pull in two optional user supplied date values to the server-side controller so I can use it to filter query results, yet apparently I'm not passing them correctly, because each time I run a test my debug statements come back that they're null.
Markup:
<aura:component controller="TBN_Dashboard" access="global" implements="flexipage:availableForAllPageTypes">
<ltng:require styles="/resource/SLDSv213/assets/styles/salesforce-lightning-design-system.css"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:registerEvent name="DashboardEvent" type="c:DashboardEvent"/>
<aura:attribute name="selRoles" type="String[]" />
<aura:attribute name="selRoleList" type="String[]" />
<aura:attribute name="selReports" type="String[]" />
<aura:attribute name="dteTo" type="String" />
<aura:attribute name="dteFrom" type="String" />
<div class="slds" style="min-height: 500px; max-width:1300px; width:1300px;">
<div class="slds-grid paddingTop">
<div style="max-width:90%">
<div class=" slds-text-align--left">
<div class="slds-grid">
<div class="slds-col">
<div class="slds-form-element roleDiv" style="min-width: 110px">
<div class="slds-form-element__label">Level: </div>
<div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRole" change="{!c.onRoleChange}" >
<aura:iteration items="{!v.selRoles}" var="roleName">
<ui:inputSelectOption text="{!roleName}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element hierarchyDiv paddingleft" style="min-width: 170px">
<div class="slds-form-element__label">Role Hierarchy: </div>
<ui:inputSelect class="slds-select" aura:id="InputSelectRoleHierarchy" change="{!c.onRoleHierarchyChange}" disabled="true">
<aura:iteration items="{!v.selRoleList}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 270px">
<div class="slds-form-element__label">Dashboard:</div>
<div>
<ui:inputSelect class="slds-select" change="{!c.onReportChange}" aura:id="InputSelectReport">
<aura:iteration items="{!v.selReports}" var="roleVal">
<ui:inputSelectOption text="{!roleVal}"/>
</aura:iteration>
</ui:inputSelect>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date from:</label>
<div class="slds-form-element__control">
<ui:inputText aura:id="InputDateFrom" class="slds-input" value="{!v.dteFrom}"
placeholder="Choose a starting date Ex:(7/1/17)" />
</div>
</div>
</div>
</div>
<div class="slds-col">
<div class="slds-form-element reportDiv paddingleft" style="min-width: 100px">
<div class="slds-form-element">
<label class="slds-form-element__label" for="text-input-id-1">Date to:</label>
<div class="slds-form-element__control">
<ui:inputText aura:id="InputDateTo" class="slds-input" value="{!v.dteTo}"
placeholder="Choose a starting date Ex:(7/1/17)" />
</div>
</div>
</div>
</div>
<div class="slds-col paddingleft paddingTop">
<div class="slds-form-element">
<lightning:button aura:id="searchButton" label="Go" onclick="{!c.showChart}"/>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="Charts">
<c:TBN_VisualCharts />
</div>
</div>
</aura:component>
Controller:
({
doInit : function(component, event, helper) {
helper.getRole(component);
helper.getReport(component);
component.find("InputSelectRole").set("v.value", 'National'),
component.find("InputSelectReport").set("v.value", 'Accounts without Activity for 30 days'),
component.find("InputSelectRoleHierarchy").set("v.value", '--None Selected--')
},
showChart : function(component, event, helper) {
var inputCmp = component.find("InputSelectRoleHierarchy");
if(component.find("InputSelectRole").get("v.value") != 'National' && (component.find("InputSelectRoleHierarchy").get("v.value") == '--None Selected--' || component.find("InputSelectRoleHierarchy").get("v.value") == null)){
console.log('>>>>>>>');
inputCmp.set("v.errors", [{message:"Please select picklist value "}]);
}
else{
inputCmp.set("v.errors", null);
console.log('=======here----1---');
var appEvent = $A.get("e.c:DashboardEvent");
appEvent.setParams({
"selRole" : component.find("InputSelectRole").get("v.value"),
"selReport" : component.find("InputSelectReport").get("v.value"),
"selRoleName" : component.find("InputSelectRoleHierarchy").get("v.value"),
"dteFrom" : component.find("InputDateFrom").get("v.value"),
"dteTo" : component.find("InputDateTo").get("v.value")
});
appEvent.fire();
}
},
onRoleChange : function(component, event, helper) {
helper.disableSelectRole(component);
helper.getRoleNamePicklist(component);
},
onRoleHierarchyChange : function(component, event){
var inputSelReport = component.find("InputSelectReport");
setTimeout(function(){ inputSelReport.focus(); }, 20);
},
onReportChange : function(component, event){
var searchbutton = component.find("searchButton");
setTimeout(function(){ searchbutton.focus(); }, 20);
}
})
Helper:
({
getRole : function(component) {
var action = component.get("c.getRoleNames");
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoles", stringItems);
component.set("v.selRoleList", '--None Selected--');
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
getReport : function(component){
var action1 = component.get("c.getReportNames");
action1.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state====1==',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selReports", stringItems);
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action1);
},
getRoleNamePicklist : function(component){
//this.disableSelectRole(component, event);
var action = component.get("c.getRoles");
var InputSelectRole = component.find("InputSelectRole").get("v.value");
action.setParams({
"selRole" : component.find("InputSelectRole").get("v.value")
});
action.setCallback(this, function(response) {
var state = response.getState();
console.log('=====state======',state);
if (component.isValid() && state === "SUCCESS") {
var stringItems = response.getReturnValue();
component.set("v.selRoleList", stringItems);
var selRole =component.find("InputSelectRoleHierarchy");
selRole.set("v.value", "--None Selected--");
}
else if (state === "ERROR") {
console.log("===>>>=== ", response.getError());
}
});
$A.enqueueAction(action);
},
disableSelectRole : function(component){
var inputSelReport = component.find("InputSelectReport");
var inputSel = component.find("InputSelectRoleHierarchy");
var searchbutton = component.find("searchButton");
if(component.find("InputSelectRole").get("v.value") == 'National'){
inputSel.set("v.disabled", true);
setTimeout(function(){ inputSelReport.focus(); }, 20);
}
else{
inputSel.set("v.disabled",false);
setTimeout(function(){ inputSel.focus(); }, 20);
}
}
})
Apex Controller method:
@AuraEnabled
public static string getReportVals(string selRole, string selRoleName, string selReport, String dteFrom, String dteTo) {
try{
date dateFromFilter = date.parse(dteFrom);
}
catch(Exception ex){
system.debug('Parse error or no date entered: ' + dteFrom);
}
try{
date dateToFilter = date.parse(dteTo);
}
catch(Exception ex){
system.debug('Parse error or no date entered: ' + dteTo);
}
String JsonString ;
//calls the method based on selReport value and assigns result to JsonString.
if(selReport == 'Accounts without Activity for 30 days'){
JsonString = getAccountWithoutActivity(selRole, selRoleName);
}
else if(selReport == 'PD Monthly Meeting' || selReport == 'QBR Tracking'){
JsonString = getDashboardData(selRole, selRoleName, selReport);
}
else if(selReport == 'Risk Account'){
JsonString = getRiskAccount(selRole, selRoleName);
}
return JsonString;
}
Everything else is working as intended, it's just when I'm trying to pass those dteFrom and dteTo variables in the controller method that I'm hitting a snag, so any help would be appreciated.Thanks.
- CMielczarski
- June 16, 2017
- Like
- 0