Rendering Forms
Learn the different ways of rendering a form on your website when using Umbraco Forms.
There are three options available for rendering a form.
To display a form in your view, you can make a call to a view component:
@await Component.InvokeAsync("RenderForm", new { formId = Guid.Parse("<form guid>"), theme = "default", includeScripts = false })
Four parameters can be provided:
formIdis the GUID of a form.recordIdis an optional existing record GUID, used if editing records via the website is enabled in configuration
Usually, rather than hard-coding the form's GUID, you'll use a form and/or theme picker property on your page:
@await Component.InvokeAsync("RenderForm", new { formId = @Model.Form, theme = @Model.Theme, includeScripts = false })
If you prefer a tag helper syntax, you can use one that ships with Umbraco Forms.
Firstly, in your
_ViewImports.cshtml file, add a reference to the Umbraco Forms tag helpers with:@addTagHelper *, Umbraco.Forms.Web
Then in your view you can use:
@if (Model.Form.HasValue)
{
<umb-forms-render form-id="@Model.FormId.Value" theme="@Model.FormTheme" exclude-scripts="true" />
}
With a grid or Rich Text Editor, you need to use a macro. This is also available as an option to display a form in your view, where you provide three parameters:
@await Umbraco.RenderMacroAsync("renderUmbracoForm", new { FormGuid = "<form guid>", FormTheme = "default", ExcludeScripts = "1" })
FormGuidis the GUID of a form.FormThemeis the name of a theme. If not provided, the default theme is used.ExcludeScriptstakes a value of 0 or 1, indicating whether scripts should be excluded from rendering.
Similarly, you can reference a form picker property on your page:
@if (Model.FormId is Guid formId)
{
@await Umbraco.RenderMacroAsync("renderUmbracoForm", new { FormGuid = formId, FormTheme = Model.FormTheme, ExcludeScripts = "1" })
}
Last modified 2mo ago