Submitting a form via email

I’ve created a form within my app and I’ve created a button so when I click submit it sends a email. However I want it to send that form in a email but I’m not sure how to do it??

Hi

So on your submit button, right click it and then select Start/Edit Workflow. It will then take you to the workflow area.

You’ll then want to add an event, to tell Bubble what to do when this button is clicked. Select the following:
image
Email > Send email

You will then see the following:

The To address you can either set manually, by typing the email address in or selecting it dynamically, so click in the ‘To’ field and then the box ‘Insert dynamic data’ will appear, where you can find a email address either on the page or via the database.
Same type of logic applies to the other fields, you can either manually set these by typing in or pull data from a pages element e.g. Input Persons Name’s value e.g. John Smith.

So then to pull in the form data, you can specify this in the ‘Body’ section of the send email. You can use the ‘Insert dynamic data’ to bring the form values that are on the page into this email.

It can be tricky to get the right layout with paragraphing, so I suggest perhaps adding each field in the form, then you can click the ‘Rich text editor’ button. In there you can play about more with the sizing, page breaks and general appearance of fonts.

bubble-post

Hope that helps.

Luke

1 Like

thanks for your help I’ve managed to do it. Another question is can you show a message to show that its been submitted ok?

Also I’m setting up a timesheet feature , what input do you think would be best to use?

Your welcome.

Yes sure, there are number of ways to present and inform the user that the form / email has been submitted all okay. In the Editor, under the visual elements, add a new element which is called ‘Alert’ to the page.

It could be setup like the following (with your own style and message):

Example:

Then back over on the workflows, after the email workflow event, add a new workflow event:
image
Element Actions > Show message

Select the alert and make any changes to the display time 5000ms = 5 seconds
image

Thats it. The alert will only display after the email has sent, so only when the sequence completes.

As for the timesheet feature I’d need more details, but for a time input I’d say try:
image
You can find these in the Plugins section of the editor and install for free.

I managed to do the display message so thanks for your help again.
Regards the timesheet , the plumbers fill out the plot number of the house, Job description of the job , cost of the job and then add up the total cost for there work that week, so I need to put this into app form.

Glad you’ve got it sorted. Please mark this post as ‘solved’.

Okay sounds simple enough. The time pickers I have recommended work well in terms of ease of use for the user interface, so maybe try both and see what works best.

going back to the submitting a form via email, can you not do it so it sends the form exactly how it looks in the app? As it looks more professional

Unfortunately its not possible to add custom HTML + CSS code within the ‘Send email’ workflow action.

As far as I’m aware, you’d need to use a SendGrid template, linked to your Bubble app

Or alternatively use another 3rd party provider via the Bubble API Connector.

With that said it looks like @AliFarahat might be working on a solution (I’m very intrigued)

im not sure how to send him a pm

Hey @luke2

Yep I got it and it’s able to generate HTML and CSS inline with images as url. Will be happy to give you beta access. DM me your apps name as I am working on documentation for it which should be ready in few days or so.

I’m not sure how to send you a DM?

Hi @AliFarahat

Nice, sounds promising.

Sure have just sent you a DM. Look forward to trying out.

Cheers

This topic was automatically closed after 70 days. New replies are no longer allowed.