I have a custom website form. I am trying to write pageCode and Backend code to create an email from the form filled elements and also to attach uploaded files
I have made the email send with basic form fill elements
I cannot make the uploads go as attachments
This is my site and form:
https://www.stayontrackvetphysiotherapy.co.uk/new-referral-form
This is my pageCode:
import wixData from 'wix-data';
import {sendEmail, sendEmailWithRecipient} from 'backend/email';
$w.onReady(function () {
$w("#dataset1").onAfterSave(sendFormData);
});
async function sendFormData() {
console.log('Form data saved');
const subject = `New Vet Referral Form from ${$w("#input1").value}`;
const addressObj1 = $w('#addressInput2').value;
const formattedAddress1 = `${addressObj1.streetAddress.formattedAddressLine}, ${addressObj1.city}, ${addressObj1.subdivision} ${addressObj1.postalCode}, ${addressObj1.country}`;
const addressObj2 = $w('#addressInput3').value;
const formattedAddress2 = `${addressObj2.streetAddress.formattedAddressLine}, ${addressObj2.city}, ${addressObj2.subdivision} ${addressObj2.postalCode}, ${addressObj2.country}`;
const animalDOB = new Date($w("#datePicker1").value);
const formattedAnimalDOB = animalDOB.toLocaleDateString();
const body = `New Vet Referral from ${$w("#input1").value}
\rOwners Name: ${$w("#input1").value}
\rOwners Email: ${$w("#input2").value}
\rOwners Contact Number: ${$w("#input3").value}
\rOwners Address and Post Code: ${formattedAddress2}
\rAnimals Name: ${$w("#input4").value}
\rAnimal Species: ${$w("#dropdown1").value}
\rAnimal Breed: ${$w("#input5").value}
\rAnimal DOB: ${formattedAnimalDOB}
\rReferring Vet: ${$w("#input6").value}
\rReferring Vet Practice: ${$w("#input7").value}
\rPractice Address and Postcode: ${formattedAddress1}
\rVet Email: ${$w("#input8").value}
\rVet Phone: ${$w("#input9").value}
\rBrief Description of the Problem: ${$w("#input10").value}
\rPreference for making this appointment: ${$w("#dropdown3").value}`;
// Get file attachments
const attachments = [];
const fileUrls1 = [];
const fileUrls2 = [];
// Get file attachments from uploadButton1
if ($w('#uploadButton1').value.length > 0) {
const files1 = $w('#uploadButton1').value;
for (const file1 of files1) {
const file1Data = await file1.getFile();
attachments.push({
filename: file1.name,
contentType: file1Data.type,
content: await file1Data.arrayBuffer(),
});
fileUrls1.push(file1Data.url); // Store file URL
}
}
// Get file attachments from uploadButton2
if ($w('#uploadButton2').value.length > 0) {
const files2 = $w('#uploadButton2').value;
for (const file2 of files2) {
const file2Data = await file2.getFile();
attachments.push({
filename: file2.name,
contentType: file2Data.type,
content: await file2Data.arrayBuffer(),
});
fileUrls2.push(file2Data.url); // Store file URL
}
}
const recipient = $w("#input8").value;
// Save the form data and file URLs to the database collection
const collection = wixData.getCollection("VetReferral");
collection.insert({
name: $w("#input1").value,
email: $w("#input2").value,
'Owners Contact Number': $w("#input3").value,
'Owners Address and Post Code': formattedAddress2,
'Animals Name': $w("#input4").value,
'Animal Species': $w("#dropdown1").value,
'Animal Breed': $w("#input5").value,
'Animal DOB': formattedAnimalDOB,
'Referring Vet': $w("#input6").value,
'Referring Vet Practice': $w("#input7").value,
'Practice Address and Postcode': formattedAddress1,
'Vet Email': $w("#input8").value,
'Vet Phone': $w("#input9").value,
'Brief Description of the Problem': $w("#input10").value,
'Preference for making this appointment': $w("#dropdown3").value,
fileUrls1: JSON.stringify(fileUrls1), // Store file URLs from uploadButton1
fileUrls2: JSON.stringify(fileUrls2), // Store file URLs from uploadButton2
});
console.log('Data inserted successfully'); // Placeholder statement
I am getting this error from my Chrome Console and also Google Cloud Console
createConsoleProxy.ts:47 UserError: An error occurred in one of afterSave callbacks
at eval (https://static.parastorage.com/services/dbsm-viewer-app/1.6863.0/app.js:6:52458)
at eval (https://static.parastorage.com/services/dbsm-viewer-app/1.6863.0/app.js:6:25005)
at async Promise.all (index 0)
(anonymous) @ createConsoleProxy.ts:47
eval @ Logger.js:119
eval @ Logger.js:53
log @ Logger.js:87
log @ index.js:28
eval @ index.js:76
eval @ index.js:14
Promise.catch (async)
eval @ index.js:14
eval @ index.js:23
eval @ index.js:11
eval @ eventListeners.js:27
o @ eventListeners.js:27
fireEvent @ eventListeners.js:38
eval @ index.js:11
f @ effects.js:128
eval @ effects.js:238
await in eval (async)
fold @ result.js:6
eval @ effects.js:231
await in eval (async)
eval @ index.js:81
eval @ index.js:11
eval @ middleware.js:39
try_ @ either.js:59
f @ middleware.js:38
eval @ middleware.js:85
Promise.then (async)
eval @ middleware.js:116
h @ middleware.js:113
m @ middleware.js:129
eval @ middleware.js:159
fold @ either.js:34
eval @ middleware.js:156
v @ datasetApi.js:99
save @ datasetApi.js:193
eval @ index.js:81
eval @ index.js:11
eval @ index.js:127
eval @ index.js:11
eval @ defaultComponentBindingApi.ts:104
eval @ corvidEvents.js:76
(anonymous) @ registerEvent.ts:51
(anonymous) @ clientWorker.ts:141
n @ comlink.ts:312
createConsoleProxy.ts:47 Caused by: TypeError: e(...).getCollection is not a function
at t5vmt.js:71:22
at f (external commonjs "wix-data":1:36)
at Generator._invoke (external commonjs "wix-data":1:36)
at Generator.next (external commonjs "wix-data":1:36)
at u (external commonjs "wix-data":1:36)
at i (external commonjs "wix-data":1:36)
at external commonjs "wix-data":1:36
at new Promise (<anonymous>)
at external commonjs "wix-data":1:36
at f (t5vmt.js:8:1)
Google Cloud Console:
{
"insertId": "..........6BlC7a07CBzuYFNSQ35.ji",
"jsonPayload": {
"message": "UserError: An error occurred in one of afterSave callbacks\nCaused by TypeError: e(...).getCollection is not a function\n at eval (https://static.parastorage.com/services/dbsm-viewer-app/1.6863.0/app.js:6:52458)\n at eval (https://static.parastorage.com/services/dbsm-viewer-app/1.6863.0/app.js:6:25005)\n at async Promise.all (index 0)",
"serviceContext": {
"version": "1893",
"service": "https://www.stayontrackvetphysiotherapy.co.uk"
}
},
"resource": {
"type": "global",
"labels": {
"project_id": "wix-managed-920f4ca9"
}
},
"timestamp": "2023-05-17T15:32:15.440000057Z",
"severity": "ERROR",
"labels": {
"viewMode": "Site",
"corvidTimestamp": "2023-05-17T15:32:15.794Z",
"revision": "1893",
"tenantId": "d7ff07b1-1e21-4a82-b8cd-b30042fffa64",
"siteUrl": "https://www.stayontrackvetphysiotherapy.co.uk",
"namespace": "Velo"
},
"logName": "projects/wix-managed-920f4ca9/logs/d7ff07b1-1e21-4a82-b8cd-b30042fffa64",
"operation": {
"id": "..........3UdpTmiBK8UdNVppgKqFkr",
"producer": "https://www.stayontrackvetphysiotherapy.co.uk"
},
"receiveTimestamp": "2023-05-17T15:32:15.902182994Z"
}
There seems to be a problem with the call to .getCollection
Anyone has any ideas what I might need to do to resolve ?