Send email to site owner on form submission by clients using customized enquiry form

Ask the community
,
5

Hi, Here is what I did. The sender and recipient are my website email. I have added a replier field that is the email of the person who filled in the contact form. When I receive the email it is to me (haven’t figured out how to get around that) but when I reply to the email, it puts the email of the person who filled in the form in the to: field. I have bolded the fields I added below - do not bold in your code (well, I don’t know if that matters).

In the email.jsw file I added replier to the return fields - bold below but don’t bold in your code:
//email.jsw

import {sendWithService} from ‘backend/sendGrid’;

export function sendEmail(subject, body, replier) {
const key = “my sendgrid key”;
const recipient = “my website email”;
const sender = “my website email”;
return sendWithService(key, sender, recipient, replier , subject, body);
}

in the sendGrid.js file I added replier to the export function and &replyto=${replier to the from fields:
//sendGrid.js

import {fetch} from ‘wix-fetch’;

export function sendWithService(key, sender, recipient, replier , subject, body) {
const url = “https://api.sendgrid.com/api/mail.send.json”;

const headers = {
“Authorization”: "Bearer " + key,
“Content-Type”: “application/x-www-form-urlencoded”
};

const data = from =${sender}&to=${recipient} **&replyto=${replier** }&subject=${subject}&html=${body};

const request = {
“method”: “post”,
“headers”: headers,
“body”: data
};

return fetch(url, request)
.then(response => response.json());
}

Then in my Page Code I added the const replier statement and added replier to the send fields as in bold below (do not make bold when you do this with your code):
import { sendEmail } from ‘backend/email’;

$w.onReady( function () {
$w(“#dataset1”).onAfterSave(sendFormData);
});

function sendFormData() {
// Get the date from the date field of the current item
const date = $w(“#dataset1”).getCurrentItem().preferredDate;
// Set the text element to display the date using the user’s settings
$w(“#text19”).text = date.toLocaleDateString(“en-NZ”);
const subject = Booking Request from ${$w("#input1").value};

//add other form data here

const replier = $w(“#input2”).value;

sendEmail(subject, body,  **replier** ) 
    .then(response => console.log(response));

}

Hope that helps.