Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
MailThis.to Ajax Example
// The following example POSTS data to mailthis.to, redirects the user to a confirmation page, and then sends an email (upon the successful completion of Recaptcha verification)
$.post('https://mailthis.to/test@example.com', {
email: 'foo@bar.co',
_subject: 'hi!',
message: 'Test'
}).then(function () {
location.href = 'https://mailthis.to/confirm'
});
@availit

This comment has been minimized.

Copy link

@availit availit commented Apr 3, 2018

Is there any way you could add a feature that allows you to set the _after (redirect) url in a query string parameter for use with Ajax submissions?

For example: https://mailthis.to/confirm?after=https://myhomepage.net

@dharmyx

This comment has been minimized.

Copy link

@dharmyx dharmyx commented May 14, 2019

@availit There won't be a need for redirection since this is AJAX based.

@ramit-mitra

This comment has been minimized.

Copy link

@ramit-mitra ramit-mitra commented Jul 13, 2019

Will the above code work if I skip the line "location.href = 'https://mailthis.to/confirm'" ?

@xxillyap

This comment has been minimized.

Copy link

@xxillyap xxillyap commented Aug 6, 2019

Hello! I have just started programing so probably the solution is very simple. Anyway, as I understand it I need to add the " location.href = 'https://mailthis.to/confirm'" code in but the problem is that I am not sure where to add it. It would be amazing if anyone could help me out! Thank you!

$(function() {
$("#contactForm input,#contactForm textarea").jqBootstrapValidation({
preventSubmit: true,
submitError: function($form, event, errors) {
// additional error messages or events
},
submitSuccess: function($form, event) {
event.preventDefault(); // prevent default submit behaviour
// get values from FORM
var name = $("input#name").val();
var email = $("input#email").val();
var phone = $("input#phone").val();
var message = $("textarea#message").val();
var firstName = name; // For Success/Failure Message
// Check for white space in name for Success/Fail message
if (firstName.indexOf(" ") >= 0) {
firstName = name
.split(" ")
.slice(0, -1)
.join(" ");
}
$this = $("#sendMessageButton");
$this.prop("disabled", true); // Disable submit button until AJAX call is complete to prevent duplicate messages
$.ajax({
url: "https://mailthis.to/illyapwork@gmail.com",
type: "POST",
data: {
name: name,
phone: phone,
email: email,
message: message
},
cache: false,
success: function() {
// Success message
$("#success").html("

");
$("#success > .alert-success")
.html(
"×"
)
.append("");
$("#success > .alert-success").append(
"Your message has been sent. "
);
$("#success > .alert-success").append("
");
//clear all fields
$("#contactForm").trigger("reset");
},
error: function() {
// Fail message
$("#success").html("
");
$("#success > .alert-danger")
.html(
"×"
)
.append("");
$("#success > .alert-danger").append(
$("").text(
"Sorry " +
firstName +
", it seems that my mail server is not responding. Please try again later!"
)
);
$("#success > .alert-danger").append("
");
//clear all fields
$("#contactForm").trigger("reset");
},
complete: function() {
setTimeout(function() {
$this.prop("disabled", false); // Re-enable submit button when AJAX call is complete
}, 1000);
}
});
},
filter: function() {
return $(this).is(":visible");
}
});

$('a[data-toggle="tab"]').click(function(e) {
e.preventDefault();
$(this).tab("show");
});
});

/*When clicking on Full hide fail/success boxes */
$("#name").focus(function() {
$("#success").html("");
});

@rogeriorioli

This comment has been minimized.

Copy link

@rogeriorioli rogeriorioli commented Nov 25, 2019

if you need use react u can use this hook

import React, { useState } from "react"
import axios from 'axios'


function ContatoPage() {
  const [contact, setContact] = useState({})


  const getValues = e => {
    e.persist()
    e.preventDefault()
    setContact(contact => ({ ...contact, [e.target.name]: e.target.value, assunto : 'contato do site' }))
    
  }
  const sendContact = (e) => {
    e.preventDefault()
        axios.post('https://mailthis.to/rogeriorioli', contact).then(response => {
          window.location.href = 'https://mailthis.to/confirm'
        }).catch(err => {
          err = 'oh fuck '
        })
  }
  return (
      <main>
        <div className="container">
          <article>
            <div className="col">
              <h2>Fale Conosco</h2>
              <form onSubmit={sendContact}  encType="multipart/form-data">
                <input type="text" name="nome" placeholder="Seu Nome" onChange={getValues}/>
                <input type="email" name="email" placeholder="seuemail@servidor.com.br"  onChange={getValues} />
                <textarea placeholder="escreva sua mensagem" name="message"  onChange={getValues}></textarea>
                <button type="submit">Enviar</button>
              </form>
            </div>
            <div className="col"></div>
          </article>
        </div>
     </main>
    </Layout>
  )
}

export default ContatoPage```
@daksamedia

This comment has been minimized.

Copy link

@daksamedia daksamedia commented Jan 4, 2020

I tried this up but none of this worked.

@erwindemoel

This comment has been minimized.

Copy link

@erwindemoel erwindemoel commented Feb 27, 2020

Is it possible to use an ajax POST call, without having to redirect our users away from our website? We want to do an asychronous call in the backend to send our email without a redirect.

@CodeAlDente

This comment has been minimized.

Copy link

@CodeAlDente CodeAlDente commented Apr 1, 2020

You received this because you signed up for MailThis.to, a form to email se=
rvice. <br><br><br><br>Have a Wonderful Day!<br><br><img src=3D"https://u94=
00108.ct.sendgrid.net/wf/open?upn=............../>

ref https://sendgrid.com/docs/ui/account-and-settings/tracking/#open-tracking

A tracking pixel inside the mail. Come on @kidGodzilla, seriously?

@kidGodzilla

This comment has been minimized.

Copy link
Owner Author

@kidGodzilla kidGodzilla commented Sep 11, 2020

Original author here. Thanks for your comments, I didn't get these replies because the service was sold a few years back.

However, it appears it was abandoned by the purchaser, and I have began restoring service. Things should be online now.

@CodeAlDente This appears to be a SendGrid default, or something enabled recently by the previous owner. I'll take a look.

@skiwheelr

This comment has been minimized.

Copy link

@skiwheelr skiwheelr commented Sep 15, 2020

How can i send a file using this?
I learned that $.post cannot be used to send a file, so i need to use $.ajax.
What would the syntax be?

@skiwheelr

This comment has been minimized.

Copy link

@skiwheelr skiwheelr commented Sep 15, 2020

export const SendMail = () => {
	// $.post('https://mailthis.to/skiwheelr@gmail.com',{
	// 	email: 'foo@bar.co',
	// 	_subject: 'hi!',
	// 	message: 'Test',
	// 	file: './dgsl.png'
	// }).then(function () {
	// 	window.location.href = 'https://mailthis.to/confirm'
	// });

	$.ajax({
		url: 'https://mailthis.to/ski******@gmail.com',
		type: 'post',
		data: {
			email: 'foo@bar.co',
			_subject: 'hi!',
			message: 'Test',
			file: './dgsl.png'
		},
		headers: {
			encType:'multipart/form-data',
		},
		dataType: 'json',
		success: function (data) {
			console.info(data);
		}
	});
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.