Custom form rendering using the built in FormContainerBlock

A critical vulnerability was discovered in React Server Components (Next.js). Our systems remain protected but we advise to update packages to newest version. Learn More.

AI OnAI Off

Home / Forums / Developers (Main Products) Forum / Developer to developer /

Custom form rendering using the built in FormContainerBlock

Mårten Olofsson

Vote:

I'm trying to perform some custom rendering of a form using Epi Forms 5.4.0. I do not want to copy the contents of the FormContainerBlock.cshtml located in the EPiServer.Forms.zip but rather just render the block using what's already there.

This is the controller:

[TemplateDescriptor(AvailableWithoutTag = true,
    ModelType = typeof(LeadsFormBlock))]
public class LeadsFormBlockController : FormContainerBlockController {
    protected override IViewComponentResult InvokeComponent(FormContainerBlock currentBlock) {
        if(currentBlock is LeadsFormBlock leadsFormBlock) {
            var viewModel = new LeadsBlockViewModel { CurrentBlock = currentBlock, OtherProperty = leadsFormBlock.OtherProperty };

            return View("Index", viewModel);
        }

        return base.InvokeComponent(currentBlock);
    }
}


And the view:

@model LeadsBlockViewModel

<div class="custom-class">
    <h3>This is the wrapping form!</h3>
    <strong>@Model.OtherProperty</strong> @* Works *@ 
    @Html.PropertyFor(x => x.CurrentBlock) @*Does not work/Renders nothing*@
    @await Html.PartialAsync("FormContainerBlock", Model.CurrentBlock) @*Crashes because cannot find the view*@ 
</div>

#297861

Edited, Mar 07, 2023 11:16

Mark Stott

Vote:

Hello Mårten,

The root path to find the forms views is under /FormsViews/ and then it's pretty much as per the structure in the EPiServer.Forms.zip file. So in the case of the FormContainerBlock you can use the following:

@model MyBuild.Features.Blocks.CustomForm.CustomFormBlock

<div>
    <h2>Hello World</h2>
    @await Html.PartialAsync("~/FormsViews/Views/ElementBlocks/Components/FormContainerBlock/FormContainerBlock.cshtml", Model);
</div>

#298058

Mar 10, 2023 15:19

Mårten Olofsson

Vote:

Thank you Mark! :)

#298651

Mar 20, 2023 14:04

This topic was created over six months ago and has been resolved. If you have a similar question, please create a new topic and refer to this one.