What to do with the data from my contact form

What to do with the data from my contact form


My portfolio has a contact form that gets name, email and message, but how do I get it to send that to me? https://codepen.io/cullian/pen/MmboOR?editors=0010


Check this one : https://stackoverflow.com/questions/5773174/html-button-to-send-email


I am already using mailto: for the email address link. Here is something more like what I want. Bootstrap 3 form. This one uses javascript to post the information from a form. How do I get it to send an email to me with that information. The post does not work on codepen and my real portfolio is on github.io which is a static page. I would like to use javascript to email me the information in the form.


What you want is on the backend side of development, but you can use somebody else’s backend, and this is so easy, I’m using it right now: https://formspree.io/. You’ll be up and running in five minutes.


Formspree is the way to go if you have github pages, works really well.

In a form tag you need to specify an action attribute, ie form action=“yourScript.php”

When the form is submitted it needs to be handled by the server and a server side language. That’s where a php script works, it will run it’s script and do something with the data, which in most cases is send the data to your email.

I have a script I use on my own site if you want one, pm me I’ll send it to you, it’s easy to understand but in order to use it you’d need a website of your own along with an email account with your hosting provider.


This seems to be what I want, but I am having trouble setting up the ajax. I tried pasting in the ajax snippet, but it does not work, I don’t know jquery very well yet. Here is a link form with ajax added to javascript


You should send your data as key - value pairs, for JSON to be recognized by formspree (at least I think so). So, define variables, such as
var name = $("input#name").val();,

and then use these variables:

`data: {
                name: name,
                phone: phone,
                email: email,
                message: message

Also, you don’t need to specify form action and method in html - that should be done in .js file.

This is how I did it (only the relevant part of the code):

        var name = $("input#name").val();
        var email = $("input#email").val();
        var phone = $("input#phone").val();
        var message = $("textarea#message").val();
            url: "https://formspree.io/[email protected]",
            method: "POST",
            data: {
                name: name,
                phone: phone,
                email: email,
                message: message
            dataType: "json"

Oh, and after console.log(result); you have "json" word/string, although you have already defined data type above: dataType: "json".


Thanks for all the help, got it working! https://cullian.github.io/