I created a lightning-record-edit-form to create records and get a QrCode.
Everything is fine until I got to save the record and link it to another sObject.
I can't pass the newly record to the Apex Controller.
All I get is a "null input to JSON parser"
This is my code,
I'm not good at LWC, I'm still learning.
I hope I was clear enough, thanks in advance
Apex Class
@AuraEnabled
public static void savePrenotazione(String prenotazioneObj,String disponibilitaObj) {
List<Disponibilit__c> listDispTrovate;
Prenotazione__c prenotazione = new Prenotazione__c();
Type dispType = Type.forName('List<Disponibilit__c>');
Type prenType = Type.forName('Prenotazione__c');
listDispTrovate = (List<Disponibilit__c>) JSON.deserialize(
disponibilitaObj,
dispType);
System.debug('listDispTrovate :' + listDispTrovate);
System.debug('prenotazioneObj :' + prenotazioneObj);
prenotazione = (Prenotazione__c) JSON.deserialize(
prenotazioneObj,
prenType);
System.debug('prenotazione :' + prenotazione);
insert prenotazione;
if (!listDispTrovate.isEmpty() && prenotazione.Privacy_T__c) {
System.debug('Prenotazione :' + prenotazione.id);
for (Disponibilit__c d : listDispTrovate) {
d.Prenotazione_T__c = prenotazione.id;
d.Prenotato_T__c = true;
}
update listDispTrovate;
List<Disponibilit__c> listControllo = [
SELECT Id, Prenotazione_T__c, Prenotato_T__c
FROM Disponibilit__c
WHERE Prenotazione_T__c = :prenotazione.Id AND Id IN :listDispTrovate
];
if (listControllo.size() == listDispTrovate.size()) {
System.debug('tutto ok prenotazione Conclusa');
} else {
System.debug('Problema da gestire');
}
}
}
Javascript
import { LightningElement, api, track, wire } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import dispCamera2 from '@salesforce/apex/SSG_T_Controller_PrenotazioneLWC.getDispCamera2';
import savePrenotazione from '@salesforce/apex/SSG_T_Controller_PrenotazioneLWC.savePrenotazione';
import dataInizio from '@salesforce/label/c.SSG_Data_inizio_soggiorno';
import dataFine from '@salesforce/label/c.SSG_Data_fine_soggiorno';
import viaggiDaSolo from '@salesforce/label/c.SSG_viaggi_da_solo';
import numeroPersone from '@salesforce/label/c.SSG_numero_persone';
import CAMERA_OBJECT from '@salesforce/schema/Camera__c';
import PRENOTAZIONE_OBJECT from '@salesforce/schema/Prenotazione__c';
import TIPOLOGIA_FIELD from '@salesforce/schema/Camera__c.Tipologia_T__c';
import STATO_FIELD from '@salesforce/schema/Prenotazione__c.Stato_T__c';
import PAGAMENTO_FIELD from '@salesforce/schema/Prenotazione__c.Modalit_di_pagamento_T__c';
import { getObjectInfo, getPicklistValues } from 'lightning/uiObjectInfoApi';
import userId from '@salesforce/user/Id';
var cameraName;
const columns = [
{ label: 'Disponibilità', fieldName: 'Id' },
{ label: 'Data inizio', fieldName: 'Data_inizio_fascia_T__c', type: 'date' },
{ label: 'Data fine', fieldName: 'Data_fine_fascia_T__c', type: 'date' },
// { label: 'Camera', fieldName: },
];
export default class formPrenotazioneLWC extends LightningElement {
@api recordId;
@track isOne = false;
@track camere;
valueTipologia;
dataInizio;
dataFine;
isDaSolo;
nPersone;
stato;
tipoCamera;
modPagamento;
isPrivacy;
isPerTe;
columns = columns;
data = [];
showDisponibilita;
prenotazioneObj;
label ={
dataInizio,
dataFine,
viaggiDaSolo,
numeroPersone
};
@wire(getObjectInfo, { objectApiName: CAMERA_OBJECT })
objectInfo;
@wire(getPicklistValues, { recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName: TIPOLOGIA_FIELD })
tipologiaPicklistValues;
@wire(getObjectInfo, { objectApiName: PRENOTAZIONE_OBJECT })
prenotazioneInfo;
@wire(getPicklistValues, { recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName: STATO_FIELD })
statoPicklistValues;
@wire(getObjectInfo, { objectApiName: PRENOTAZIONE_OBJECT })
prenotazioneInfo;
@wire(getPicklistValues, { recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName: PAGAMENTO_FIELD })
pagamentoPicklistValues;
handleDataInizio(event) {
this.dataInizio = event.detail.value
console.log('DATA INIZIO : ' + JSON.stringify(this.dataInizio));
}
handleDataFine(event) {
this.dataFine = event.target.value
console.log('DATA FINE : ' + JSON.stringify(this.dataFine));
}
handleChangeTravel(event) {
this.isDaSolo = event.detail.checked;
console.log('DA SOLO ? : ' + JSON.stringify(this.isDaSolo));
let element = this.template.querySelector('[data-id="nPers"]');
element.value = "1"
this.nPersone = element.value;
// (this.isDaSolo == true) ? this.isOne = true : this.isOne = false;
console.log('Numero persone in da solo : ' + JSON.stringify(this.nPersone));
}
handleChangePersone(event) {
this.nPersone = event.detail.value;
let element = this.template.querySelector('[data-id="numPers"]');
element.value = this.nPersone;
console.log('Numero persone : ' + JSON.stringify(this.nPersone));
}
handleChangeStato(event) {
this.stato = event.target.value;
console.log('STATO : ' + JSON.stringify(this.stato));
}
handleChangeTipologia(event) {
this.valueTipologia = event.detail.value;
console.log('TIPOLOGIA CAMERA : ' + JSON.stringify(this.valueTipologia));
}
handleChangePagamento(event) {
this.modPagamento = event.target.value;
console.log('MODALITA PAGAMENTO : ' + JSON.stringify(this.modPagamento));
}
handleChangePrivacy(event) {
this.isPrivacy = event.detail.checked;
console.log('IS PRIVACY : ' + JSON.stringify(this.isPrivacy));
}
handleChangePerTe(event) {
this.isPerTe = (event.target.value === 'Si') ? true : false;
console.log('PER TE : ' + JSON.stringify(this.isPerTe));
}
callApex() {
this.showDisponibilita = true;
// let disponibilitaId;
console.log('this.showDisponibilita : ' + JSON.stringify(this.showDisponibilita));
dispCamera2({
dataInizio: this.dataInizio, dataFine: this.dataFine, isDaSolo: this.isDaSolo, nPersone: this.nPersone, stato: this.stato,
tipologiaCamere: this.valueTipologia, modPagamento: this.modPagamento, isPrivacy: this.isPrivacy, isPerTe: this.isPerTe
})
.then(result => {
this.camere = result;
this.data = result;
this.error = undefined;
console.log('Disponibilità : ' + JSON.stringify(this.data));
// console.log("ID disponibilità " + disponibilitaId);
// console.log("camera name " + cameraName);
})
}
handleSuccess(event) {
this.dispatchEvent(
new ShowToastEvent({
title: "Disponibilità creata",
message: "Record ID: " + event.detail.id,
variant: "success"
}),
);
let revId = event.detail.id
this.openModal(revId);
}
handleSubmit(event) {
console.log('prenotazione : ' + JSON.stringify(event.detail));
console.log('tipo prenotazione : ' + typeof(event.detail));
console.log('disponibilità : ' + JSON.stringify(this.data[0]));
}
handleChange(event) {
}
get optionsPersone() {
return [
{ label: "1", value: "1" },
{ label: "2", value: "2" },
{ label: "3", value: "3" },
{ label: "4", value: "4" },
{ label: "5", value: "5" },
{ label: "6", value: "6" },
{ label: "7", value: "7" },
{ label: "8", value: "8" },
{ label: "9", value: "9" },
{ label: "10", value: "10" },
];
}
get optionsPerTe() {
return [
{ label: "Si", value: "Si" },
{ label: "No", value: "No" },
];
}
openModal(revId) {
const chuildComponent = this.template.querySelector('c-modal-Form-Prenotazione');
chuildComponent.modalHeading = "Reservation QR Code";
chuildComponent.message = "Success";
chuildComponent.openModal();
setTimeout(() => { chuildComponent.generateQrCode(revId); }, 2000);
}
}
HTML
<template>
<c-modal-Form-Prenotazione></c-modal-Form-Prenotazione>
<lightning-card title="Prenotazione Record Form">
<lightning-record-edit-form
object-api-name="Prenotazione__c"
onsubmit={handleSubmit}
onsuccess={handleSuccess}
>
<lightning-messages></lightning-messages>
<lightning-input-field
field-name="Data_Inizio_soggiorno_T__c"
onchange={handleDataInizio}
>
</lightning-input-field>
<lightning-input-field
field-name="Data_fine_soggiorno_T__c"
onchange={handleDataFine}
>
</lightning-input-field>
<lightning-input-field
field-name="Viaggi_da_solo_T__c"
onchange={handleChangeTravel}
>
</lightning-input-field>
<lightning-combobox
name="Numero persone"
label="Numero persone"
data-id="nPers"
value={value}
placeholder="Seleziona un numero"
options={optionsPersone}
onchange={handleChangePersone}
read-only={isDaSolo}
>
</lightning-combobox>
<lightning-input-field
field-name="Stato_T__c"
onchange={handleChangeStato}
>
</lightning-input-field>
<lightning-input-field
data-id="numPers"
field-name="Numero_persone_T__c"
style="display: none"
>
</lightning-input-field>
<lightning-input-field
data-id="dispo"
field-name="Disponibilit_T__c"
style="display: none"
>
</lightning-input-field>
<template if:true={tipologiaPicklistValues.data}>
<lightning-combobox
name="progress"
label="Tipologia camera"
value={valueTipologia}
placeholder="Seleziona una tipologia"
options={tipologiaPicklistValues.data.values}
onchange={handleChangeTipologia}
>
</lightning-combobox>
</template>
<lightning-input-field
field-name="Modalit_di_pagamento_T__c"
onchange={handleChangePagamento}
>
</lightning-input-field>
<lightning-input-field
field-name="Privacy_T__c"
onchange={handleChangePrivacy}
required
>
</lightning-input-field>
<lightning-input-field
field-name="La_prenotazione_per_te_T__c"
onchange={handleChangePerTe}
>
</lightning-input-field>
<lightning-button
type="button"
name="Controlla disponibilità"
label="Controlla disponibilità"
onclick={callApex}
>
</lightning-button>
<template if:true={showDisponibilita}>
<lightning-datatable key-field="id" data={data} columns={columns}>
</lightning-datatable>
<lightning-button
type="submit"
name="submit"
label="Crea Prenotazione"
>
</lightning-button>
</template>
</lightning-record-edit-form>
</lightning-card>
</template>
