Forms

Create


Forms are the collection tools of Formcake. Every action is related to a form, and every submission from your presentation layer is associated with a form as well. Create a form now.

Form Settings

Name - The form's name is to help you distinguish between sets of data. We recommend that you create a new form for each presentation layer in your application and name them descriptively. As an example, our 404 page uses a form that we named 'Error Page Feedback Form'. This name is never exposed to an end user, but it's useful for keeping track of where your data is flowing.

Description (optional) - A form's description is just that: descriptive text that is more informative than the title.

Success Redirect (optional) - When you use an HTML presentation layer (i.e. a <form> tag) the user's browser will redirect them to whatever URL you configure here. If you leave this field blank, by default we will redirect to https://formcake.com/submission. When you submit data to a form with JSON content instead (e.g. with fetch(...)), this field is ignored.

Whitelisted Domains (optional) - Whitelisted domains are domains that Formcake will accept when a form submission occurs. Only domains and subdomains can be whitelisted, not full urls. Full urls will be stripped down to their domain upon saving or updating a form. If no domains are added then the form is open to submissions from any source.

Install


Submission Endpoint

The submission endpoint is http://api.formcake.com/api/form/<form id>/submission and can be found in the install tab of your form:

HTML Presentation Layer

Put the submission endpoint in the action attribute of your <form> tag. Set the method to POST:

<form
    method="POST"
    action="https://api.formcake.com/api/form/501a916d-b47a-4e98-b53c-17ae9bdee5f6/submission"
>

Other Presentation Layers

POST to the submission endpoint. Add a Content-Type header with application/json. You can do this in native Javascript with:

const SUBMISSION_ENDPOINT = 'https://api.formcake.com/api/form/501a916d-b47a-4e98-b53c-17ae9bdee5f6/submission';
const formcakePost = (data = {}) => fetch(SUBMISSION_ENDPOINT, {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(data),
});

formcakePost({example: 'data'})
    .then((response) => response.json())
    .then((data) => console.log(data));

Submission Responses


Content-Type application/x-www-form-urlencoded

When your presentation layer POSTs to a form with the application/x-www-form-urlencoded Content-Type (i.e. with an HTML presentation layer):

1. If you have a redirect configured, the browser will redirect to that URL.

2. If you do not have a redirect configured, the browser will redirect to https://formcake.com/submission.

Content-Type application/json

When your presentation layer POSTs to a form with the application/json Content-Type, Formcake will return JSON.

Success:

{
	"data": {
		"example": "data"
	},
	"id": 638,
	"formId": "501a916d-b47a-4e98-b53c-17ae9bdee5f6",
	"domain": "https://formcake.com/docs",
	"updatedAt": "2020-05-18T01:29:52.983Z",
	"createdAt": "2020-05-18T01:29:52.983Z"
}

Failure:

{
    "message": "Domain <disallowed domain> not allowed.",
    "name": "badRequestError"
}

Typically you will only receive failures when the domain you are submitting from is disallowed in your form's settings.

Test


Test Via Formcake

In the install tab of your form, in step 4, there's a section titled 'Use Your Form'. If you use that form to send data, it will trigger all the actions in your form and store a submission with your content inside of it.

Test Via Your Presentation Layer

As soon as you create a form, it is available for use. You can immediately begin testing your form without any delay.

Delete


Deleting a Form

When you delete a form, all associated actions and submissions are removed and are not recoverable.

You can delete a form by going to the settings tab of your form and clicking 'Delete Form'.