Example: Send email with the SendGrid NPM interface.

#Example #Sendgrid #Email #WebModules #ServerSide #backend #3rdPartyServices #PackageManager #ExternalCode #NPM


Demonstrates

In order to run this example in the editor, you will need a Sendgrid account to supply your own Sendgrid API key . Paste the key in the appropriate line in the sendEmail.jsw file.

The live demo of this example has an additional field for the your Sendgrid API Key. To run the live demo , paste your API Key into the Sendgrid API Key input field before clicking the Send Email button.

Links for this example

This example uses the SendGrid mail NodeJS package included in the Wix Package Manager to replace the sendGrid.js file in original SendGrid REST example . Using built-in code packages is easier and more convenient than having to write your own code.

As in the original example, we start by setting up a simple form with all of the fields necessary to send an email. When the user completes the form, the user clicks the Send button to request that the email be sent. The fields are checked for validity, and if everything is OK, the backend sendMail() function calls the SendGrid NodeJS send() function to send the email. A Lightbox then opens to notify the user of the email’s transmission status (success or failure).

For more information, see the Wix Package Manager and the Sendgrid API documentation .

Wow! That opens up a whole new world. I somehow missed the introduction of the PM. Was looking at the Google Calendar API, bu this is great. Good work.
PS the Gear Icon (in PM Doc) should be + sign.

Glad you like this Giri. The new PM (NPM) feature is really awesome and will open up lots of doors.

Thanks for pointing out the doc error. I’ve already reported this.

Epiccccc. Thanks Wix Team

@yisrael-wix In the example code, bottom part, shouldn´t this:

. catch ((error) => {
let dataObj = {
status: “success”,
email: $w(‘#toEmail’).value
};
wixWindow.openLightbox(“Message”, dataObj);

be
status: “failure” //

or something?

@giri-zano :exploding_head: I hate it when I’m stupid.

@giri-zano Fixed!

Parabéns pelo exemplo… bem simples. Sabe alguma coisa sobre Socket.IO?

Congratulations on the example ... very simple. Do you know anything about Socket.IO?

The socket.io package is available in the Wix Package Manager .

@yisrael-wix yes, but the dot in the name of package return a error in import…

@swellybenevides I tried this:

var io = require('socket.io')();

It works fine. It gets an “require undefined” error which you can ignore. This will be fixed in the future.

@yisrael-wix
Could, please show me a simple example, type “hello world” using socketIO with wixcode. Thank you!!!

@yisrael-wix Got the code implemented but it is not hitting sendgrid using this api. Here is the editor link for the site. Please can you have a look snd let me know where I am going wrong?

Did you try the example? The example is tested and works fine.

I see you modified the sendEmail() function in sendEmail.jsw. I would recommend first using the exact code in the example since it is tested code. You can then start applying your changes step by step testing as you go.

@yisrael-wix all I am trying to do is get the user input of their name and email address in a form and send an email with a sendgrid template with a download button. Dont even want to personalise the email template at this point. Pulling what is left of my hair out.

@stewart Did you try the example as-is? It works. You can use the exact code from the example in your site.

@yisrael-wix ok - so I can get that working but how do I attach it to my sendgrid transactional template. Tried by adding the sendgrid v3 transactional templateid into the page code:
https://www.wix.com/code/home/forum/community-discussion/sending-template-emails-with-sendgrid-v3
but no dice…

@stewart You have the sendEmail.jsw from the example, but I don’t see where you are calling the sendEmail() function from the file.

i’ll rework my form so it matches the syntax of the example and see if can get it to call the sendgrid api. Also, where can I see the console.log to see the fail points - so I can get more visibliity and try and fix it myself (and learn at the same time!)?

@stewart You should be able to see console.log() output in the browser’s console (e.g. Chrome):