How do I send email through HTML and JavaScript?

Question

I have a contact form on my website and I wanted to make a send button. I would not want an e-mail program on the computer to start, I just want the text to be sent to my e-mail right away by just pressing the button. I have searched for weeks now on the internet and I am giving up.

<form method="post" name="contact" action="#">
    <label for="author">Name:</label>
    <input type="text" id="author" name="author" class="required input_field" />
    <div class="cleaner h10"></div>

    <label for="email">Email:</label>
    <input type="text" class="validate-email required input_field" name="email" id="email" />
    <div class="cleaner h10"></div>

    <label for="subject">Subject:</label>
    <input type="text" class="validate-subject required input_field" name="subject" id="subject"/>                             
    <div class="cleaner h10"></div>

    <label for="text">Message:</label>
    <textarea id="text" name="text" rows="0" cols="0" class="required"></textarea>
    <div class="cleaner h10"></div>             

    <input type="submit" value="Send" id="submit" name="submit" class="submit_btn float_l" />
    <input type="reset" value="Reset" id="reset" name="reset" class="submit_btn float_r" />
</form>

Answer 1

Maybe if you don't want to use php, you may try just use an external API to provide you the email to be sent.

Mandrill can do that. It's free up to 12k emails per month.

In you page the code would be like this:

$.ajax({
  type: “POST”,
  url: “https://mandrillapp.com/api/1.0/messages/send.json”,
  data: {
    ‘key’: ‘YOUR API KEY HERE’,
    ‘message’: {
      ‘from_email’: ‘[email protected]’,
      ‘to’: [
          {
            ‘email’: ‘[email protected]’,
            ‘name’: ‘RECIPIENT NAME (OPTIONAL)’,
            ‘type’: ‘to’
          },
          {
            ‘email’: ‘[email protected]’,
            ‘name’: ‘ANOTHER RECIPIENT NAME (OPTIONAL)’,
            ‘type’: ‘to’
          }
        ],
      ‘autotext’: ‘true’,
      ‘subject’: ‘YOUR SUBJECT HERE!’,
      ‘html’: ‘YOUR EMAIL CONTENT HERE! YOU CAN USE HTML!’
    }
  }
 }).done(function(response) {
   console.log(response); // if you're into that sorta thing
 });

Here how:

https://medium.com/design-startups/b53319616782

http://www.codecademy.com/tracks/mandrill (CodeCademy can teach how to use the API)