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

Ask the community
,
1

I have created a customized enquiry form on my contact us page, currently no email send to my inbox. I follow the steps in Velo Tutorial: Sending an Email on Form Submission | Help Center | Wix.com. It works. But what can i set for the sender and recipient variables? Recipient should be the owner’s email but how is the sender? I don’t want my inbox shows the sender as “me”, i know this will happen if i use the same email for sender and recipient. Any other option to do this?
//email.jsw
import {sendWithService} from ‘backend/sendGrid’;
export function sendEmail(subject, body) {
const key = “QL.cFH5YHZQQ2_fG0z_KuQ.6WPTYEyjN1C3_7Wt9Hb3jGfkJNAyzJhz3ddhM”; const sender = “from.email@domain.com”;
const recipient = “to.email@domain.com”;
return sendWithService(key, sender, recipient, subject, body);
}

2

Hi Cha nel

You could set the input of any element on your page, for instance…

const sender = $w("input1").value;

Tiaan

3

I have done this but all email do not come through. SendGrid has a replyto field that I can put the email address of the person who filled out the form into. How do I add that field in the wix code?

Thanks, Page

4

Hey! I have the same problem! Does anyone here have a solution? Thanks!

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.