You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: powerapps-docs/maker/model-driven-apps/add-move-configure-or-delete-components-on-form.md
+16-11Lines changed: 16 additions & 11 deletions
Original file line number
Diff line number
Diff line change
@@ -34,45 +34,48 @@ To add components to a form, use the **Components** pane. The **Components** pan
34
34
35
35
### Add components to a form using drag and drop
36
36
> [!NOTE]
37
-
> When adding or moving components using drag and drop be aware that the form preview is responsive and may render multiple section columns as stacked. To ensure that the component that's added or moved is in the correct section column, drop or paste it anchored to another field or component that is already in that section column.
37
+
> When adding or moving components using drag and drop, be aware that the form preview is responsive and might render multiple section columns as stacked. To ensure that the component that's added or moved is in the correct section column, drop or paste it anchored to another field or component that is already in that section column.
38
38
1. Open the form designer to create or edit a form. More information: [Create a form](create-and-edit-forms.md#create-a-form) or [Edit a form](create-and-edit-forms.md#edit-a-form)
39
-
2. On the command bar, select **Add component**, or in the left pane, select **Components** to see a list of available components. You can also hover over a component in the list to see a preview image, description and other details of that component.
39
+
2. On the command bar, select **Add component**, or in the left pane, select **Components** to see a list of available components. You can also hover over a component in the list to see a preview image, description, and other details of that component.
40
40
3. In the **Components** pane, search or scroll to find the component that you want to add and then select it.
41
41
4. Drag and drop the component onto the form preview. As you drag the component on the form preview, you will see drop targets where you can add the component.
42
-
Note the following:
42
+
43
+
Note the following:
43
44
- Components can be dropped before or after any existing component or field.
44
45
- Components can also be dropped in the empty area within a section. In this case the component will be added in an available space so as to evenly distribute fields and components across the section columns.
45
46
- Hovering over a tab header when dragging a component changes the currently selected tab, allowing you to add the component to a different tab.
46
47
- When you drop the component, in most cases, you will see a dialog to configure the properties of the component. Ensure that you have configured all the required properties of the component.
47
-
5. In the dialog to configure the properties of the component, under **Show component on**, the **Web**, **Mobile** and **Tablet** options are selected by default to ensure the component is used when the form is displayed on the web, mobile app and tablet app. Based on your requirements you can clear some of these options to limit the usage of the component. Select **Done**.
48
+
5. In the dialog to configure the properties of the component, under **Show component on**, the **Web**, **Mobile**, and **Tablet** options are selected by default to ensure the component is used when the form is displayed on the web, mobile app, and tablet app. Based on your requirements you can clear some of these options to limit the usage of the component. Select **Done**.
48
49
6. Repeat steps 3-5 above to add more components.
49
50
7. On the command bar, select **Save** to save the form, or select **Publish** if you want to save and make your changes visible to users.
50
51
51
52
### Add components for a field on the form
52
53
1. Open the form designer to create or edit a form. More information: [Create a form](create-and-edit-forms.md#create-a-form) or [Edit a form](create-and-edit-forms.md#edit-a-form)
53
54
2. In the form preview, select an existing field.
54
55
3. In the property pane, under the **Components** area, select **+ Component**.
55
-
4. The **Add component** dialog displays a list of components that are available for the current field type. You can hover over a component in the list to see a preview image, description and other details of that component.
56
+
4. The **Add component** dialog displays a list of components that are available for the current field type. You can hover over a component in the list to see a preview image, description, and other details of that component.
56
57
5. In the **Add component** dialog, search or scroll to find the component you want to add and then select it.
57
58
In most cases, a dialog is displayed so you can configure the properties of the component. Ensure that you have configured all the required properties of the component.
58
-
6. In the dialog to configure the properties of the component, under **Show component on**, the **Web**, **Mobile** and **Tablet** options are selected by default to ensure the component is used when the form is displayed on the web, mobile app and tablet app. Based on your requirements you can clear some of these options to limit the usage of the component. Select **Done**.
59
+
6. In the dialog to configure the properties of the component, under **Show component on**, the **Web**, **Mobile**, and **Tablet** options are selected by default to ensure the component is used when the form is displayed on the web, mobile app, and tablet app. Based on your requirements you can clear some of these options to limit the usage of the component. Select **Done**.
59
60
7. Repeat steps 2-6 above if you want to add more components to the same or another field.
60
61
8. On the command bar, select **Save** to save the form, or select **Publish** if you want to save and make your changes visible to users.
61
62
62
63
## Configure components on a form
63
64
1. Open the form designer to create or edit a form. More information: [Create a form](create-and-edit-forms.md#create-a-form) or [Edit a form](create-and-edit-forms.md#edit-a-form)
64
65
2. In the form preview, select an existing field.
65
66
3. In the property pane, under the **Components** area, select the component that you want to configure.
66
-
4. You may see a dialog to configure the properties of the component. Change the properties of the component as needed and select **Done**.
67
+
4. You might see a dialog to configure the properties of the component. Change the properties of the component as needed and select **Done**.
67
68
5. Repeat steps 2-4 to configure more components on the same or another field.
68
69
6. On the command bar, select **Save** to save the form, or select **Publish** if you want to save and make your changes visible to users.
69
70
70
71
## Move components on a form
71
-
You can move components on a form by either draganddrop or cutandpaste actions.
72
+
You can move components on a form by either drag-and-drop or cut-and-paste actions.
72
73
73
74
### Move components on a form using drag and drop
74
75
1. Open the form designer to create or edit a form. More information: [Create a form](create-and-edit-forms.md#create-a-form) or [Edit a form](create-and-edit-forms.md#edit-a-form)
75
-
2. In the form preview, select the component that you want to move and drag and drop it. As you drag the component on the form preview, drop targets appear where you can move the component. Note the following:
76
+
2. In the form preview, select the component that you want to move and drag and drop it. As you drag the component on the form preview, drop targets appear where you can move the component.
77
+
78
+
Note the following:
76
79
- Components can be dropped before or after any existing component or field.
77
80
- Components can also be dropped in the empty area within a section. In this case the component will be added in an available space to evenly distribute components and fields across the section columns.
78
81
- Hovering over a tab header when dragging a component changes the currently selected tab, allowing you to add the component to a different tab.
@@ -83,8 +86,10 @@ You can move components on a form by either drag and drop or cut and paste actio
83
86
1. Open the form designer to create or edit a form. More information: [Create a form](create-and-edit-forms.md#create-a-form) or [Edit a form](create-and-edit-forms.md#edit-a-form)
84
87
2. In the form preview, select the component that you want to move.
85
88
3. On the command bar, select **Cut**.
86
-
4. In the form preview, select another existing component, field, or section. You can also switch to a different tab if needed.
87
-
5. On the command bar, select **Paste** or select the chevron, and then select **Paste before**. Note the following:
89
+
4. In the form preview, select another existing component, field, or section. You can switch to a different tab if needed.
90
+
5. On the command bar, select **Paste** or select the chevron, and then select **Paste before**.
91
+
92
+
Note the following:
88
93
- When you select **Paste**, the component being moved is pasted after the existing component or field.
89
94
- When you select **Paste before**, the component being moved is pasted before the existing component or field.
90
95
- When you select a section, the component being moved is added in an available space so as to evenly distribute components and fields across the section columns. The **Paste before** action is not applicable and therefore not available in this case.
0 commit comments