Hi all. I'm working on step 7 in Lightning Component Framework Specialist superbadge. When I tried to save new BoatReview record, it doesn't save. All my code that are in component.find("service").saveRecord(function(saveResult) { ... }); not execute. I tried to add some console.log to my controller's function but they doesn't print. This is my controller function onSave.
onSave : function(component, event, helper) {
var boat = component.get("v.boat");
var boatr = component.get("v.boatReview");
component.set("v.boatReview.Boat__c",boat.Id);
console.log("boat review "+boatr.Boat__c);
console.log("boat name: " + boatr.Name);
var data = component.find("service");
console.log("service" + data);
component.find("service").saveRecord(function(saveResult) {
if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") {
var resultsToast = $A.get("e.force:showToast");
if(resultsToast)
{
resultsToast.setParams({
"title": "Saved",
"message": "Boat Review Created"
});
resultsToast.fire();
}
else
{
alert('Boat Review Created');
}
} else if (saveResult.state === "INCOMPLETE") {
console.log("User is offline, device doesn't support drafts.");
} else if (saveResult.state === "ERROR") {
console.log('Problem saving record, error: ' + JSON.stringify(saveResult.error));
} else {
console.log('Unknown problem, state: ' + saveResult.state + ', error: ' + JSON.stringify(saveResult.error));
}
var boatReviewAddedEvnt=component.getEvent("boatReviewAdded");
boatReviewAddedEvnt.fire();
helper.onInit(component,event,helper);
});
},
and some part of markup:
<force:recordData aura:id="service"
fields="Id, Name, Comment__c, Boat__c, Rating__c"
targetRecord="{!v.boatReviewRecord}"
targetFields="{!v.boatReview}"
targetError="{!v.recordError}"
recordUpdated="{!c.onRecordUpdated}"
mode="EDIT"
/>
<lightning:layoutItem size="12" class="slds-align--absolute-center">
<lightning:button iconName="utility:save" label="Submit" onclick="{!c.onSave}"/>
</lightning:layoutItem>
Here is the code .. link to the codehttps://gist.github.com/yasarshaikh/8edea8850bced036bec925a1d6f6db47 <aura:component implements="flexipage:availableForAllPageTypes" access="global" >
<aura:attribute name="boat" type="Boat__c" access="public"/>
<!-- <aura:attribute name="BoatReview" type="Object" access="private"/> -->
<aura:attribute name="boatReview" type="BoatReview__c" access="private"/>
<aura:attribute name="newBoatReview" type="Object" />
<aura:attribute name="recordError" type="String" access="private"/>
<aura:registerEvent name="BoatReviewAdded" type="c:BoatReviewAdded" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<force:recordData aura:id="service"
layoutType="FULL"
fields="Id, Name, Comment__c, Boat__c, Rating__c"
targetFields="{!v.boatReview}"
targetError="{!v.recordError}"
recordUpdated="{! c.onRecordUpdated }" />
<!-- Display Lightning Data Service errors -->
<aura:if isTrue="{!not(empty(v.recordError))}">
<div class="recordError">
<ui:message title="Error" severity="error" closable="true">
{!v.recordError}
</ui:message>
</div>
</aura:if>
<!-- Display the new contact form -->
<div class="slds-form slds-form_stacked">
<lightning:input aura:id="title" name="title" label="Title"
value="{! v.boatReview.Name }" required="true"/>
<lightning:inputRichText aura:id="Comment" value="{! v.boatReview.Comment__c }" disabledCategories="FORMAT_FONT"/>
<lightning:button label="Submit" onclick="{!c.onSave }"
iconName="utility:save" />
</div>
</aura:component>
({
doInit : function(component, event, helper) {
helper.onInit(component, event, helper);
},
onSave : function(component, event, helper) {
component.find("service").saveRecord($A.getCallback(function (saveResult){
if (saveResult.state == 'ERROR')
{
console.log('Error saving review record: ' + component.get('v.recordError'));
}
else {
var toastEvent = $A.get('e.force:showToast');
if (toastEvent) {
toastEvent.setParams({
title: 'Success!',
message: 'Your review has been saved successfully'
});
toastEvent.fire();
} else {
alert (message);
}
helper.onInit(component, event, helper);
component.getEvent('BoatReviewAdded').fire();
}
}));
},
onRecordUpdated: function(component, event, helper){
}
})
({
onInit : function(component, event, helper) {
var recordTypeId = null;
var skipCache = false;
var boatid = component.get('v.boat.Id');
component.find("service").getNewRecord(
'BoatReview__c',
recordTypeId,
skipCache,
$A.getCallback(function() {
var review = component.get('v.boatReview');
var error = component.get('v.recordError');
if (error || !review) {
console.log('Error initalizing review template: ' + error);
} else {
review.Boat__c = component.get('v.boat').Id;
}
})
);
},
alertSuccess: function(message) {
var toastEvent = $A.get('e.force:showToast');
if (toastEvent) {
toastEvent.setParams({
title: 'Success!',
message: message
});
toastEvent.fire();
} else {
alert (message);
}
}
})
