Subscribe to our newsletter
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Ever needed to add more data in Optimizely Forms? Our Full-Stack Optimizely Developer Binh Nguyen shows us how she adds extra data, in her latest blog. Enjoy!
Optimizely Forms is a built-in add-on from the Optimizely development team that enables users to create forms dynamically via a block-based approach. Developers can install Optimizely Forms to any Optimizely CMS or Customized Commerce site by installing NuGet package.
Optimizely Forms allows content editors to create forms dynamically as a normal block, dragging and dropping available form elements such as text box, text area, date time, file upload, and image into a form container block.
This means that editors can easily design any form with the necessary controls and re-use it on any pages for various purposes such as user surveys, user registration, user feedback, and user support.
Once users submit a form, data will be automatically saved into the database permanently. We can also send submission data to third parties via connectors for auto-marketing purposes.
This image illustrates creating a form in the Edit User Interface:
After creating a form and placing the form in pages, users can see it when viewing page like this:
The image below illustrates how to apply Optimizely Forms, and how it works:
As a developer, I realized that we can do a lot of customization with Optimizely Forms, such as creating new form elements, adding more post submission actors, and implementing custom connectors.
Recently, I got a requirement that a client wanted to have extra data in all submission data, like page URL, and page category. These extra fields must be stored in the database, and shown in the form submissions view and exporting files.
This image below shows how submission data is displayed in the backend user interface.
You can see that data in the blue border is filled by users, and data in the orange border is system data – or, not filled by a user. Is it possible to add more data similar to the default system data?
Short answer: Yes! We can customize it, and I’ll show you how.
1. First, we need a new post submission actor to add the extra data to the submission data. This actor should be run first by setting an order to make sure that extra data is always added to submission data before all other actors.
2. Next, to display extra data in view and export file, add the following:
3. Finally, we must override the default FormRepository with the new one by adding the following code in Startup.cs:
services.AddSingleton<IFormRepository, CustomFormRepository>();
services.AddSingleton<FormRepository, CustomFormRepository>();
Here is the final result, after applying the above code changes:
And that's how it's done! Thank you for following along on this tutorial.
Binh Nguyen is a Full-Stack Optimizely Developer who has been on the First Line Software team for a year and a half. With 12 years of experience in Optimizely, Binh is a major asset to her projects in the IT Services and Healthcare industries. Her work mostly consists of building CMS sites and commerce sites based on the Optimizely framework and the .NET framework and working with .NET Core.
.svg)
.svg)
.svg)