I want to create a component with one input box with type="date" and a combobox that gets populated with options after a date is selected in the first input box component. I want this to happen in real time(async maybe?), right after the dateChange in the input box. I have tried a method which can be seen below, but as far as I can gather it is not async, and it also throws this error "UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag --unhandled-rejections=strict
(see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode)."
As can be seen, I do in fact throw a .catch() statement after the method but I still get this warning.
Anyway the function I use is not asynchronous so any suggestion is welcomed.
leftComponent.html
<template>
<lightning-layout class="slds-align_left slds-text-align_center container" multiple-rows="true">
<lightning-layout-item size="12">
<lightning-input type="date" label="Enter appointment date" variant="label-hidden"
placeholder="Choose date of appointment" onchange={handleDateChange}></lightning-input>
</lightning-layout-item>
<lightning-layout-item size="12">
<lightning-combobox name="timeBox"></lightning-combobox>
</lightning-layout-item>
</lightning-layout>
</template>
leftComponent.js
import getVisitsByDate from '@salesforce/apex/VisitsController.getVisitsByDate';
import { LightningElement,api, track } from 'lwc';
export default class LeftComponent extends LightningElement {
@track dateSelected;
@api selectedVisit;
async handleDateChange(event){
this.dateSelected=event.target.value;
if(this.dateSelected){
getVisitsByDate({
record : {
sObjectType: 'Visit__c',
Date__c: this.dateSelected
}
}
).then((value) => {
console.log(JSON.stringify(value));
return value;
}
).catch((e) => {
console.log('Throws error'+e.body);
});
}
}
}
VisitsController.cls(only relevant code)
public with sharing class VisitsController {
@AuraEnabled
public static List<Visit> getVisitsByDate(Visit__c record) {
String date = record.Date__c;
String usrId= UserInfo.getUserID();
List<SObject> visits = Database.query(
'SELECT Name, Date__c, Time__c, Patient_Email__c, Patient_Name__c, Description__c FROM Visit__c WHERE CreatedById=:usrId AND Date__c=:date ORDER BY Time__c ASC'
);
return getVisits(visits);
}
//Method that wraps sObject into a Visit object
public static List<Visit> getVisits(List<SObject> objs) {
List<Visit> visits = new List<Visit>();
for (SObject obj : objs) {
Visit visit = new Visit();
visit.visitDate=Date.valueOf(obj.get('Date__c'));
Visit.visitTime= obj.get('Time__c');
visit.patientEmail= String.valueOf(obj.get('Patient_Email__c'));
visit.patientName=String.valueOf(obj.get('Patient_Name__c'));
visit.visitDescription=String.valueOf(obj.get('Description__c'));
visit.visitName=String.valueOf(obj.get('Name'));
visits.add(visit);
}
return visits;
}
class Visit{
@AuraEnabled
public Date visitDate;
@AuraEnabled
public Time visitTime;
@AuraEnabled
public String patientEmail;
@AuraEnabled
public String patientName;
@AuraEnabled
public String visitDescription;
@AuraEnabled
public String visitName;
}
}
Visit.visitTime= obj.get('Time__c');
should bevisit.visitTime= (Time)obj.get('Time__c');
. However, you also seem to have the async function defined incorrectly - I'm not sure of the correct format for that.async
. You don't need it. Plus it's causing the errors.Aura
components, it could well affect lwc as well.