falcon-form

command module
v0.0.0-...-d69bd99 Latest Latest
Warning

This package is not in the latest version of its module.

Go to latest
Published: Dec 3, 2021 License: MIT Imports: 9 Imported by: 0

README

drawing

New Proposed Solution

  • Use Google App Script
  • This project is no longer maintained

Simply send your contact form to our URL and we'll forward the information to your email. No backend progamming required — perfect for static sites!

Test it out with your email here!

Pure HTML example

If you want to keep things simple by only using HTML to forward your form content, follow the example below:

<form action="https://falcon.warrensbox.com/your@email.com" method="POST">
    <input type="text" name="contact_name">
    <input type="email" name="contact_email">
    <textarea name="message_content" rows="3"></textarea>
    <input type="submit" value="Send">
</form>

HTML + JQuery Example

If you would like to use JQuery and HTML for further customization, use this example below:

Step 1 : HTML

Add this HTML code snippet to your source code, feel free to beautify it with some css.

<form id="form-id">
    <input type="text" name="contact_name"  id="contact_name" placeholder="Enter name"> 
    <input type="email" name="contact_email"  id="contact_email" placeholder="Enter email" required>
    <textarea name="message_content" id="message_content"  rows="3" placeholder="Write message here"></textarea>
    <input type="submit" id="submit-form" name="submit" value="Send me more details" >
</form>  

Step 2 : Add Jquery

Finally, add this code snippet in a tag or in a seperate JavaScript file.

    var $form = $('form#form-id'),
url = 'https://falcon.warrensbox.com/form'

$('#submit-form').on('click', function (e) {
    e.preventDefault();
    var form_values = $form.serializeObject()

    //required
    var config = { "owner_email":"your@email.com" } 

    $.extend(form_values,config)
    $.ajax({
        url: url,
        method: "POST",
        dataType: "json",
        data: JSON.stringify(form_values)
    }).success(
            alert("Message Sent")
    );
});

HTML + JavaScript

You also have the option to use pure JavaScript without JQuery to integrate Falcon Form:

Step 1 : HTML

Add this HTML code snippet to your source code, feel free to beautify it with some fancy css.

<form id="myForm">
    <input type="email"name="contact_email">
    <input type="text" name="contact_name">
    <textarea name="message_content"  rows="3" placeholder="Write message here"></textarea>
    <input type="submit" value="Subscribe" name="subscribe">
</form>

Step 2 : Add Javascript

Add this code snippet in a tag or in a seperate JavaScript file.

window.addEventListener("load", function () {
    function getData() {
        var formData = new FormData(form);
        var XHR = new XMLHttpRequest();
        var url = 'https://falcon.warrensbox.com/form'
        var obj = {}

        for (var data of formData.entries()) {
            obj[data[0]] = data[1]
        }

        //required
        obj["owner_email"] = "your@email.com"

        XHR.addEventListener('load', function (event) {
            alert('Message sent');
        });

        // Define what happens in case of error
        XHR.addEventListener('error', function (event) {
            alert('Unable to send meassage!');
        });

        XHR.open('POST', url);
        XHR.send(JSON.stringify(obj));
    }

    var form = document.getElementById("myForm");
    form.addEventListener("submit", function (event) {
        event.preventDefault();
        getData();
    });
});  

Configuration

Required All configuration requires an "owner_email" attribute
Pure HTML <form action="https://falcon.warrensbox.com/your@email.com" method="POST">
JQuery var config = { "owner_email":"your@email.com" }
JavaScript obj["owner_email"] = "your@email.com"

Optional

The following are optional attributes
<input type="text" name="contact_name">
<input type="text" name="contact_number">
<textarea name="message_content" rows="3"></textarea>

How it works?

drawing

Questions?

How does this work? Let us try to answer some of your questions.

How about my privacy?

We do not store any information. All contact form contents are forwarded as it is.

How does this work?

We use a serverless architecture. Form contents are send to AWS lambda and routed to AWS SES to forward your email.

Need more features?

We’re working hard to add more features. Shoot us an email at support@warrensbox.com with your request.

What about this project?

This is a free and opensource project hosted on github. Feel free to make a pull request and contribute to the project.

Issues

Open Issue

Documentation

The Go Gopher

There is no documentation for this package.

Directories

Path Synopsis

Jump to

Keyboard shortcuts

? : This menu
/ : Search site
f or F : Jump to
y or Y : Canonical URL