Checkboxes in Email notification not showing properly

_anat-1 · April 12, 2018, 5:15am

Hi,
I’ve created a form with many checkboxes, and after following the thread posted by Naama (answered by Yisrael) this is what my code looks like. However, something is wrong/missing as the email notification does not include anything after the let comma = “”; command.
The website: https://anatbelinson.wixsite.com/inflatafunvi-new
The page: Booking

Any help will be appreciated. Here is the code and the email notification:

import {sendEmail, sendEmailWithRecipient} from ‘backend/email’;

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

function sendFormData() {
const subject = Booking Details with InflatafunVI for ${$w("#input5").value};
const body = `Booking details for: ${$w(“#input5”).value}
\rFirst Name: ${$w(“#input5”).value}
\rLast Name: ${$w(“#input7”).value}
\rEmail: ${$w(“#input6”).value}
\rPhone#: ${$w(“#input4”).value}
\rLocation: ${$w(“#input8”).value}
\rDate: ${$w(“#datePicker1”).value}
\rStart Time: ${$w(“#dropdown1”).value}

let comma = ""; 
let Combo / Bouncy Castles = ׳\rCombo and Bouncy Castles: ׳; 

if ($w("#checkbox31").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + "Bounce n Slide"; 
	comma = ", "; 
} 

if ($w("#checkbox32").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Paw Patrol"; 
	comma = ", ";	 
} 

if ($w("#checkbox33").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Island Life"; 
	comma = ", ";	 
}     

if ($w("#checkbox34").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Big Blue"; 
	comma = ", ";	 
} 

	if ($w("#checkbox35").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Play Fort"; 
	comma = ", ";	 
} 

	if ($w("#checkbox36").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Batman"; 
	comma = ", ";	 
} 

	if ($w("#checkbox37").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Princess"; 
	comma = ", ";	 
} 

	if ($w("#checkbox38").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Sparky"; 
	comma = ", ";	 
} 

if ($w("#checkbox39").checked) { 
	Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Fire Truck Bouncer"; 
	comma = ", ";	 
} 

if(comma !== ", ") 
	Combo / Bouncy Castles = "";

Booking details for: Nuzel
First Name: Nuzel
Last Name: Nuzelton
Email: anat.belinson@gmail.com
Phone#: 1234
Location: 1234
Date: Thu Apr 12 2018 00:00:00 GMT 0300 (IDT)
Start Time: 7PM
let comma = “”

moshe-maman · April 12, 2018, 10:18am

Hi,
You seem to be missing closing back tick ( ` ) after

${$w("#dropdown1").value}

also, everything inside the following if statements needs to be added to the body variable and surrounded by backticks, example:

body += `Combo / Bouncy Castles = Combo / Bouncy Castles + "Bounce n Slide"`;

and then in the final part ( if(comma !== ", ") ), do the same. surround with back ticks and add it to the body variable.
In addition, you are missing curly brackets ( {} ) for that if statement

hope I was clear. tell me if that helps.

_anat-1 · April 12, 2018, 6:39pm

Hi,
Thanks so much for your answer. I’ve updated my code according to what you said and now I’m not getting the email notification at all

Here’s the new code:

import {sendEmail, sendEmailWithRecipient} from ‘backend/email’;

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

function sendFormData() {
const subject = Booking Details with InflatafunVI for ${$w("#input5").value};
const body = Booking details for: ${$w("#input5").value} \rFirst Name: ${$w("#input5").value} \rLast Name: ${$w("#input7").value} \rEmail: ${$w("#input6").value} \rPhone#: ${$w("#input4").value} \rLocation: ${$w("#input8").value} \rDate: ${$w("#datePicker1").value} \rStart Time: ${$w("#dropdown1").value};

let comma = ""; 
let `Combo / Bouncy Castles` = `\rCombo / Bouncy Castles:`; 

if ($w("#checkbox31").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + "Bounce n Slide"`; 
	comma = ", "; 
} 

if ($w("#checkbox32").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Paw Patrol"`; 
	comma = ", ";	 
} 

if ($w("#checkbox33").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Island Life"`; 
	comma = ", ";	 
}     

if ($w("#checkbox34").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Big Blue"`; 
	comma = ", ";	 
} 

	if ($w("#checkbox35").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Play Fort"`; 
	comma = ", ";	 
} 

	if ($w("#checkbox36").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Batman"`; 
	comma = ", ";	 
} 

	if ($w("#checkbox37").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Princess"`; 
	comma = ", ";	 
} 

	if ($w("#checkbox38").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Sparky"`; 
	comma = ", ";	 
} 

if ($w("#checkbox39").checked) { 
	body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Fire Truck Bouncer"`; 
	comma = ", ";	 
} 

if(comma !== ", ") 
	body += `Combo / Bouncy Castles = ""`;

const recipient = $w(“#input6”).value;

sendEmailWithRecipient(subject, body, recipient)
.then(response => console.log(response));

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

moshe-maman · April 15, 2018, 9:23am

Try this code:

import {sendEmail, sendEmailWithRecipient} from 'backend/email';

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

function sendFormData() {
 const subject = `Booking Details with InflatafunVI for ${$w("#input5").value}`;
 var body = `Booking details for: ${$w("#input5").value}
   \rFirst Name: ${$w("#input5").value}
   \rLast Name: ${$w("#input7").value}
   \rEmail: ${$w("#input6").value}
   \rPhone#: ${$w("#input4").value}
   \rLocation: ${$w("#input8").value}
   \rDate: ${$w("#datePicker1").value}
   \rStart Time: ${$w("#dropdown1").value}`;
   
 let comma = "";
 body += `Combo / Bouncy Castles = \rCombo / Bouncy Castles:`;
 
 	if ($w("#checkbox31").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + "Bounce n Slide"`;
		comma = ", ";
	}
	if ($w("#checkbox32").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Paw Patrol"`;
		comma = ", ";	
	}
	if ($w("#checkbox33").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Island Life"`;
		comma = ", ";	
	}    
	if ($w("#checkbox34").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Big Blue"`;
		comma = ", ";	
	}
	if ($w("#checkbox35").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Play Fort"`;
		comma = ", ";	
	}
	if ($w("#checkbox36").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Batman"`;
		comma = ", ";	
	}
	if ($w("#checkbox37").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Princess"`;
		comma = ", ";	
	}
	if ($w("#checkbox38").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Sparky"`;
		comma = ", ";	
	}
	if ($w("#checkbox39").checked) {
		body += `Combo / Bouncy Castles = Combo / Bouncy Castles + comma  + "Fire Truck Bouncer"`;
		comma = ", ";	
	}
	if(comma !== ", ")
		body += `Combo / Bouncy Castles = ""`;
		
 const recipient = $w("#input6").value;
 sendEmailWithRecipient(subject, body, recipient)
   .then(response => console.log(response)); 
 sendEmail(subject, body)
   .then(response => console.log(response));
}

_anat-1 · April 16, 2018, 9:37am

Thanks! I really appreciate all the help!!
It kinda works… I can see that only the checkboxes I selected are shown in the email notification, but is there any way to clean up the list? Keep in mind I have more checkboxes to define in a few more categories, so an organized list of selections would be awesome for the customer to have.

This is the email notification:

Booking details for: Anat
First Name: Anat
Last Name: Belinson
Email: anat.belinson@gmail.com
Phone#: 1234
Location: street
Date: Wed Apr 18 2018 00:00:00 GMT 0300 (IDT)
Start Time: 6PMCombo / Bouncy Castles = Combo / Bouncy Castles:Combo / Bouncy Castles = Combo / Bouncy Castles comma “Paw Patrol"Combo / Bouncy Castles = Combo / Bouncy Castles comma "Play Fort"Combo / Bouncy Castles = Combo / Bouncy Castles comma "Fire Truck Bouncer”

moshe-maman · April 17, 2018, 10:14am

Well, “organize” is a big concept. It requires thinking and design.
You will need to understand how you want to show this and prepare the “body” string accordingly.

_anat-1 · April 18, 2018, 7:12am

Thanks, Finally got it to work - made somewhat of a combination between your advice and the other thread about it. One last question - I would like there to be a line break after the “start time” selection. I did manage to get it but then changed it and can’t figure out how to get it back
I’ve added +“\n”; but it doesn’t seem to work… (It did work at a certain point in time, but for the life of me I can’t remember where I put it!)

this is how the email notification looks (I would like the line break after “6PM”):

Start Time: 6PM Big Blue, Sparky, Tiki Slide, Slip n’ Slide, Foot Dart, Jousting Rink, Cotton Candy, Streaming Device, Generator

And this is the code:

import {sendEmail, sendEmailWithRecipient} from ‘backend/email’;

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

function sendFormData() {
const subject = Booking Details with InflatafunVI for ${$w("#input5").value};
var body = Booking details for: ${$w("#input5").value} \rFirst Name: ${$w("#input5").value} \rLast Name: ${$w("#input7").value} \rEmail: ${$w("#input6").value} \rPhone#: ${$w("#input4").value} \rLocation: ${$w("#input8").value} \rDate: ${$w("#datePicker1").value} \rStart Time: ${$w("#dropdown1").value}+“\n”;

let comma = “”;

if ($w("#checkbox31").checked) { 
	body += "Bounce n Slide"; 
	comma = ", "; 
} 
if ($w("#checkbox32").checked) { 
	body += comma  + "Paw Patrol"; 
	comma = ", ";	 
} 
if ($w("#checkbox33").checked) { 
	body += comma  + "Island Life"; 
	comma = ", ";	 
}     
if ($w("#checkbox34").checked) { 
	body += comma  + "Big Blue"; 
	comma = ", ";	 
} 
if ($w("#checkbox35").checked) { 
	body += comma  + "Play Fort"; 
	comma = ", ";	 
} 
if ($w("#checkbox36").checked) { 
	body += comma  + "Batman"; 
	comma = ", ";	 
} 
if ($w("#checkbox37").checked) { 
	body += comma  + "Princess"; 
	comma = ", ";	 
} 
if ($w("#checkbox38").checked) { 
	body += comma  + "Sparky"; 
	comma = ", ";	 
} 
if ($w("#checkbox39").checked) { 
	body += comma  + "Fire Truck Bouncer"; 
	comma = ", "; + `\n`;	 
} 
if ($w("#checkbox40").checked) { 
	body += comma  + "Super Slide"; 
	comma = ", ";	 
} 
if ($w("#checkbox41").checked) { 
	body += comma  + "Tiki Slide"; 
	comma = ", ";	 
} 
if ($w("#checkbox42").checked) { 
	body += comma  + "Fire Truck Slide"; 
	comma = ", "; + `\n`;	 
} 
if ($w("#checkbox43").checked) { 
	body += comma  + "Big Blue Water"; 
	comma = ", ";	 
} 
if ($w("#checkbox44").checked) { 
	body += comma  + "Island Life Water"; 
	comma = ", ";	 
} 
if ($w("#checkbox45").checked) { 
	body += comma  + "Slip n' Slide"; 
	comma = ", ";	 
} 
if ($w("#checkbox46").checked) { 
	body += comma  + "Tiki Water Slide"; 
	comma = ", "; + `\n`;	 
} 
if ($w("#checkbox47").checked) { 
	body += comma  + "Slap Shot"; 
	comma = ", ";	 
} 
if ($w("#checkbox48").checked) { 
	body += comma  + "Wrecking Ball"; 
	comma = ", ";	 
} 
if ($w("#checkbox49").checked) { 
	body += comma  + "Bungee Basketball"; 
	comma = ", ";	 
} 
if ($w("#checkbox50").checked) { 
	body += comma  + "Foot Dart"; 
	comma = ", ";	 
} 
if ($w("#checkbox51").checked) { 
	body += comma  + "Zorb Balls"; 
	comma = ", ";	 
} 
if ($w("#checkbox52").checked) { 
	body += comma  + "Bumper Balls"; 
	comma = ", ";	 
} 
if ($w("#checkbox55").checked) { 
	body += comma  + "Dunk Tank"; 
	comma = ", ";	 
} 
if ($w("#checkbox54").checked) { 
	body += comma  + "Obstacle Course"; 
	comma = ", ";	 
} 
if ($w("#checkbox53").checked) { 
	body += comma  + "Jousting Rink"; 
	comma = ", ";	 
} 
if ($w("#checkbox56").checked) { 
	body += comma  + "Sumo Suits"; 
	comma = ", "; +`\n`;	 
} 
if ($w("#checkbox57").checked) { 
	body += comma  + "Shaved Ice"; 
	comma = ", ";	 
} 
if ($w("#checkbox58").checked) { 
	body += comma  + "Snow Cones"; 
	comma = ", ";	 
} 
if ($w("#checkbox59").checked) { 
	body += comma  + "Cotton Candy"; 
	comma = ", ";	 
} 
if ($w("#checkbox60").checked) { 
	body += comma  + "Popcorn"; 
	comma = ", "; +`\n`;	 
} 
if ($w("#checkbox63").checked) { 
	body += comma  + "Inflatable Screen"; 
	comma = ", ";	 
} 
if ($w("#checkbox64").checked) { 
	body += comma  + "Projector"; 
	comma = ", ";	 
} 
if ($w("#checkbox65").checked) { 
	body += comma  + "Sound System"; 
	comma = ", ";	 
} 
if ($w("#checkbox66").checked) { 
	body += comma  + "Streaming Device"; 
	comma = ", ";	 
} 
if ($w("#checkbox67").checked) { 
	body += comma  + "Nintendo"; 
	comma = ", ";	 
} 
if ($w("#checkbox68").checked) { 
	body += comma  + "Movie Night Combo"; 
	comma = ", "; +`\n`;	 
} 
if ($w("#checkbox61").checked) { 
	body += comma  + "Attendant"; 
	comma = ", ";	 
} 
if ($w("#checkbox62").checked) { 
	body += comma  + "Generator"; 
	comma = ", ";	 
} 

if(comma !== ", ") 
	body += "";

const recipient = $w(“#input6”).value;
sendEmailWithRecipient(subject, body, recipient)
.then(response => console.log(response));
sendEmail(subject, body)
.then(response => console.log(response));
}

moshe-maman · April 23, 2018, 4:43pm

try “
” to break line in emails.

_anat-1 · April 24, 2018, 5:20am

It didn’t work, but I’ve given up on adding a line break. It is what it is, and the client is fine with the way emails are coming.
Thanks for all your help!

Anat

Topic		Replies	Views
contact form, consent check box email notification Ask the community code , question	5	152	August 22, 2018
Line break in form notification email Ask the community code , question	3	153	October 7, 2020
Checkboxs code Ask the community code , question	1	162	December 5, 2018
Populating event confirmation emails with checkbox choices Ask the community code , question	0	97	June 23, 2023
Custom Newsletter form Ask the community wix-studio , code , question	0	11	January 30, 2025

Checkboxes in Email notification not showing properly

Related topics