Extending Umbraco Forms

Thursday, December 6, 2018 / mcchu28

Extending Umbraco Forms

Prepare your frontend - include required javascript

< head>
	< script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.2.4.min.js">
	< script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js">
	< script src="https://ajax.aspnetcdn.com/ajax/mvc/5.1/jquery.validate.unobtrusive.min.js">
< /head>

Rendering Forms scripts where you want

@if (TempData["UmbracoForms"] != null) { foreach (var form in (List)TempData["UmbracoForms"]) { Html.RenderAction("RenderFormScripts", "UmbracoForms", new { formid = form, theme = "yourTheme" }); } }

  • ~\Views\Partials\Forms\Themes\default (default theme)
  • ~\Views\Partials\Forms\Themes\YourTheme (your own theme)

Custom Markup

You can customize the default views using the theme method above for the following:
  • fieldtype
  • script
  • form
The FieldType (i.e. textfield, textarea, checkbox, etc) is using @Model.Id to match the value to the form field.

Creating custom HTML emails

You can include new Workflow "Send email with template (Razor)" to send out pretty HTML email.

Working with Record data

You can retrieve the form data filled out by users with different methods.


Textfield has a FieldType, render input field and save text strings
workflow has a Workflow type
datasource has a datasource type
Prevalue Source Type
Export Type - format data to a file


You can update configuration values at:

Magic strings

render values from session, cookies, Umbraco page fields

Storing Form Files with IFileSystem

You can store your forms, workflows, and preValues in a different location like the Azure Blob Cloud storage or some other place.