Error: $w(...).getFile is not a function

Ask the community
,
1

I am trying to write pageCode to attach files to an email that is sent when a form is completed

My form is here:

https://www.stayontrackvetphysiotherapy.co.uk/new-referral-form

I can build an email with the basic form fill elements included but I cannot add the uploaded files (which are added to the backend Collection)

My pageCode is here:


import wixData from 'wix-data';
import wixWindow from 'wix-window';
import {session} from 'wix-storage';
import wixLocation from 'wix-location';
import {$w} from 'wix-sdk';
import {sendEmail, sendEmailWithRecipient} from 'backend/email';

$w.onReady(function () {
  // Add code to log when upload buttons are changed
  $w('#uploadButton1').onChange(() => console.log('Attachment 1 selected'));
  $w('#uploadButton2').onChange(() => console.log('Attachment 2 selected'));
  $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 button1 = $w('#uploadButton1');
const button2 = $w('#uploadButton2');
console.log('Button 1 value:', button1.value);
console.log('Button 2 value:', button2.value);
  const attachments = [];
  console.log('Getting attachments');
  if ($w('#uploadButton1').value === '') {
  console.log('Attachment 1 not found');
} else {
  console.log('Attachment 1 found');
  const fileData = await $w('#uploadButton1').getFile();
  attachments.push({
    name: fileData.name,
    type: fileData.type,
    url: fileData.url
  });
}
if ($w('#uploadButton2').value === '') {
  console.log('Attachment 2 not found');
} else {
  console.log('Attachment 2 found');
  const fileData = await $w('#uploadButton2').getFile();
  attachments.push({
    name: fileData.name,
    type: fileData.type,
    url: fileData.url
  });
}

  const recipient = $w("#input8").value;

console.log('Sending email to recipient: ' + recipient);
  sendEmailWithRecipient(subject, body, recipient, attachments)
    .then(response => console.log(response));

console.log('Sending email to practice');
  sendEmail(subject, body, attachments)
    .then(response => console.log(response));
}



The error I get is:

createConsoleProxy.ts:47 Caused by: TypeError: $w(...).getFile is not a function