custom-controls-process.md

title	titleSuffix	description	ms.custom	ms.service	ms.assetid	ms.author	author	ms.topic	monikerRange	ms.date
Add a custom control to a WIT	Azure DevOps Services	Customize a process by adding or modifying a custom control for work item type when working in Azure DevOps Services	inherited-process	azure-devops-boards	7FC3CF0F-1E2B-4AAE-876C-5E358E7B2B72	chcomley	chcomley	how-to	>= azure-devops-2019	11/19/2018

Add extensions and custom controls to a work item type (Inheritance process)

[!INCLUDE version-gt-eq-2019]

With extensions, you can add rich functionality to your work item forms. An extension comes in four flavors, or contribution types. The following controls appear on the web form layout for all inherited and customizable work item types (WITs):

• Field-level contribution (custom controls)
• Group-level contribution
• Page-level contribution

The fourth type, action-level contributions, on the other hand, appear in the context menu of the web form.

[!INCLUDE temp]

You add all contributions by installing its extension from the Visual Studio Marketplace, Azure DevOps tab. Or, you can create your own custom control.

For example, you can add the Who recently viewed a work item? extension. This group-level contribution appears in your work item form as shown.

[!INCLUDE temp]

To add extensions or edit a process, you must be a member of the Project Collection Administrators group or be granted explicit permissions to edit a specific process.

[!INCLUDE temp]

[!INCLUDE temp]

Review installed Marketplace extensions

From the Settings context, Extensions, you can view the extensions that are already installed. You may need to choose to refresh the page to show newly installed extensions.

To learn more about extensions, see Install free extensions.

Add a Marketplace extension

You can browse the Marketplace to determine what extension(s) you want to add.

1. To add an extension to a work item type, choose your inherited process, the WIT, and then choose Get extensions.

   [!div class="mx-imgBorder"]
   

2. Select the extension you want to add. Here we choose the Work item checklist.

3. Select the organization you want to add it to and choose Install.

   [!div class="mx-imgBorder"]
   

   [!IMPORTANT]
   Extensions you install are added to all WITs across all processes.

4. Return to the process and WIT and verify the location of the extension is where you want it. Look for it at the bottom of the middle column and drag it to where you want it on the form.

   [!div class="mx-imgBorder"]
   

Add a field-level contribution or custom control

1. Install the custom control as discussed in the previous section.

2. Open Settings>Work>Process from a work item form. For details, see Open Settings>Process.

3. (Optional) Add a field to associate with the custom control. Alternatively, you can specify an existing field, inherited or custom.

4. With the WIT selected, choose Add custom control.

   [!div class="mx-imgBorder"]
   

   [!NOTE]
   If you don't see the Add custom control option, then you haven't installed a field-level extension. Or, you may need to refresh your browser to cause your browser to register any new extensions that have been recently installed.

5. Choose the custom control you want from the menu of options.

   For example, here we choose the Toggle control that you can associate with a Boolean field.

   [!div class="mx-imgBorder"]
   

6. Choose the Options tab and fill out the dialog box. The options you need to specify depend on the custom control you've selected.

   For example, here we specify the custom field, Triaged, and indicate the toggle labels to appear on the form.

   

7. (Optional) Open the Layout tab and specify the label for the field.

   Fill in any additional required fields. Review the extension description for guidance.

8. Verify the working of the custom control by opening a work item of the type you modified. You may need to refresh your browser to see your changes.

   Here, we show how the control appears by default with the checkbox and then with the toggle control.

:::row::: :::column span="1"::: Boolean field with checkbox :::column-end::: :::column span="1"::: Boolean field with toggle control :::column-end::: :::row-end::: :::row::: :::column span="1"::: :::column-end::: :::column span="1"::: :::column-end::: :::row-end:::

Group-level and page-level contributions

When you add group-level and page-level contributions, they are automatically added to all WITs defined for all processes, both inherited and custom. You can choose to hide these contributions from appearing on the form for a specific WIT, or move it within the form from the default location.

If you've installed a group or page contribution, refresh your browser, and then open a work item to view the placement of the contribution on the form. To move or hide the contribution, follow the guidance provided for the Layout tab.

Action-level contributions

Action-level contributions are added to the context menu of inherited and customizable WITs for both system and inherited processes. All action-level contributions are added to all work item types and cannot be hidden or removed without uninstalling or disabling the extension.

For example, the following image shows nine action-level contributions have been added and appear in the context menu for the user story.

Programmatically add custom controls

You can use these REST APIs to work with extensions:

• Extend the work item form
• Add a custom control to the work item form

Related articles

[!INCLUDE temp]

• Add a custom field to a work item type
• Customize a work item type
• Customize the web layout
• Customize a project using an inherited process