Tweaking and extending Episerver Forms

I’m really glad that Episerver is replacitng their Forms creation tool “XForms” and started to like Episerver Forms. Especially when it comes to a few highlights:

  • Forms and the form fields are Content Types. You can create custom markup for your fields by simply adding separate Views.
  • You can also extend and create your custom form fields by simply adding more content types. See Māris Krivtežs’ blog post about this.

However there are some areas I’m not that happy about.

Working with Forms in Edit mode

What I really like is how the Edit mode is extended so that the Editor doesn’t really need to work with the form as the Blocks it actually is. Edit mode has some new panes and thingies to easily work with the form.

edit mode - forms

But Episerver is using the normal Block preview template. But since everything is based on blocks this can easily be solved using a specific preview Controller and View for the Forms Container Block. In my example I have also added support for Element Blocks, even if they are only visible for a short moment when editing them.

Submitting Forms

One thing that annoys me a bit more is that Episerver Forms makes an AJAX request to submit the form. The reasons I don’t feel this is a good idea is because it’s not only making the site dependant on JQuery, if you’re already using JQuery the user will now download the JQuery library twice. Episerver Forms is using an old version of JQuery (1.7.2) from March 2012, I hope there won’t be any conflicts between your version and this one.

I’m trying to figure out what I can do to make Episerver Forms use a normal HTTP Request with POST to submit the forms instead but first I need to understand what the current controller “FormSubmitController” does.

I’ll dig deeper into this and get back to you.

My GitHub Repository for playing with Episerver Forms might be updated while waiting for the blog post.

2 thoughts on “Tweaking and extending Episerver Forms

  1. nitinanand27 says:

    Hi, is it possible to change property type of “Description” in Form container block? Is it recommended? If i change this from Textarea to tinymce then i would need to edit the view as well, is it even possible?

    • Alf says:

      Hi,
      There are a few ways to change the block:
      * Edit the property type on the block in Admin mode.
      * Create a block type that inherits the original one. It might be better to add a new property of type XhtmlString instead. You can easily change the view by creating a view in. Look in the .zip folder in \modules\_protected\EPiServer.Forms\ for the original. I think you can put the view in ~/Views/Shared/Blocks.
      I hope this helps
      /Alf

Leave a comment