USER GENERATED FORMS USING UMBRACO CONTOUR
Umbraco HQ has a suite of PRO products that they sell outside of the MIT license. They provide these products at a very reasonable cost and the benefits of the added features far outweigh the costs in terms of the time it would take to develop.
Contour is one of those products that developers and site administrators agree is a terrific and priceless add-on. It allows non-technical editors and administrators to easily create and publish interactive data collection forms with a few simple clicks. Installing and purchasing a license for this product produces a separate section in the Umbraco backoffice called Contour, as shown in Figure 5-13.
Contour can easily be installed by navigating to the Developer section, expanding the Packages node, expanding the Umbraco Package Repository node, and clicking on the Umbraco PRO node. Contour will be available in the resulting right-hand pane.
To create a Contour form, follow these steps:
- Navigate to the Contour section.
- Right-click the Forms node and click the Create menu option as shown in Figure 5-14.
- Start by editing the Form Name and Fieldset Title by clicking the fields as shown in Figure 5-15.
- Now, simply add fields to your form by clicking the Add Field button.
- You can easily edit the field type and other attributes (including select list, check boxes, hidden fields, data pickers, and other cool form field types) by setting them in the Add Field dialog, as shown in Figure 5-16.
- Keep adding fields as needed and Save your form.
If you expand the form, you'll find additional features for any given form. The Entries node gives you a detailed view of the submissions with various filters and sorting capabilities. This includes the ability to export the submitted data in CSV, XML, and HTML formats, as shown in Figure 5-17.
What's more is that you can also specify a number of predefined workflow actions based on the status of the form lifecycle. The following events are captured:
- Opened: A user has opened the form to start working with the data.
- Resumed: A saved but un-submitted form is resumed.
- Partially Submitted: An incomplete form was submitted.
- Submitted: The form was completed and submitted.
- Approved: An action was performed on the form entry within the Entries section of the form by an admin.
- Deleted: The form entry was deleted.
Each of the previous events come with a predefined list of event hooks that you can tap into. The even cooler part is that you can combine any and all of these actions into a single step, giving you virtually endless combinations of actions (as shown in Table 5-5).
TABLE 5-5: Combinations of Actions
As you can see, developing something this complex would be a project all on its own. The opportunity cost for you and/or your client is tremendous with the value this provides in a short timeframe.
Additional Umbraco PRO products are covered in Chapter 13.