Fields

Add any Form Input Type to your Form using the Default HTML5 Markup and Canvas’s Powerful Form Processor will do the rest. For the most optimal result, use the following code:

Code Example

<div class="col-12 form-group">
	<label for="template-contactform-name">Name <small>*</small></label>
	<input type="text" id="template-contactform-name" name="template-contactform-name" value="" class="form-control required" />
</div>

The Form Input's name is really important so that the Input Field can be processed successfully! Additionally, for the sake uniformity, always use prefixed names. Ex: template-contactform-name. This will be sent as Name in the Form Response Email. If you use template-contactform-first-name, it will sent as First Name to you. Simple as that!

Note: Disabled Fields are not sent in the Email.

Multiple Value Fields

Some Input Types accept Multiple Values, example, Checkboxes, Selects or Files. Always make sure, that you add Block Braces [] at the end of the Form Input’s name. Example: template-contactform-input[]

File Type Fields

Users can now easily send File Attachments (single or multiple) using Canvas Forms. Simply use the code below:

<div class="form-group">
	<label>Upload CV:</label>
	<input type="file" id="template-contactform-file" name="template-contactform-file" class="form-control required" />
</div>

Multiple Files

<div class="form-group">
	<label>Upload CV:</label>
	<input type="file" id="template-contactform-file" name="template-contactform-file[]" class="form-control required" multiple />
</div>

Note: Always add the enctype="multipart/form-data" Attribute to your Form Tag: <form ... enctype="multipart/form-data"> when including File Input Types.