In this video, we’ll learn how to move fields, add new fields, including between columns and sections which are covered in more detail in the next video.
As we discussed in the very first Getting Started video, the easiest way to get going with Lightning Forms is to first build your SharePoint lists, and create each of the columns that you need. There are some calculations that you can do out of the box with SharePoint, and also setting default values or data formatting can be set during the list creation. The calculations that can be performed using SharePoint out of the box are limited in comparison to Lightning Forms, but some of the basic work can be done in the list itself. Once you have created each of the columns or fields that you need, you can enter the Lightning Forms design experience on either the New Form, Edit Form, or Display Form and begin to position your fields in the order that you want them to appear. I would suggest having a practice moving fields first, and then once we have covered Tabs, Columns, and Sections, in subsequent videos, you can complete your design.
Once you are in the design experience by clicking ‘Edit Customization’ on one of the forms, you can begin to move the columns/fields around. To do so, simply hove the mouse over the column in question, and then drag it to the desired position. Where you see the green opaque rectangle, is where the column/field will be when you release the mouse button.
Instead of dragging and dropping fields, sometimes it is quicker and easier to remove and re-add them in the position that you would like them in. This is especially true when working with tabs or lists with a lot of columns/fields.
Occasionally, once we start designing our forms, we release that we need an additional column/field in our lists. You don’t need to save and close your form design experience, re-add the field within the SharePoint list, and then enter the design experience again. You can simply add your new column within the designer.
To add a new column:
- Click the + icon to add a new control within a row.
- When the dialog opens, Click the + next to Fields as highlighted below
- You will then be able to name a new column, and select the field type using the New Column dialog.
Note: Unlike the standard SharePoint forms, if you do add a new column via SharePoint or Lightning Forms, the column/field will need to be added onto the form and won’t appear automatically.