Set Up Plan Detail Forms

  • Updated

This article explains how to manage the layout of the Plan Details page in OnePlan. This requires the Plan Details App be installed. See How do I add apps?

Open the Form Editor

There are two ways to access the Plan Details Form Editor:

  • From the Global Navigation: Click Setup to enter Setup Mode. Then click the Edit icon next to the Area where you desired Plan Type is located, this will open the Editor. Click the Form Editor tab. Then select the desired Plan Type from the Plan Type drop-down.

    Access_Plan_Details_Form_Editor_from_Global_Navigation-VEED.gif

  • From the Details tab of a Plan: Go to the Details tab of the desired Plan Type to create or update the Plan Details form. Then click the Configure icon in the top right of the form to open the Form Editor.

    Click_Configure_in_Details_Tab.png

Copy an Existing Plan Details Form

You can copy an existing Plan Details form from another Plan Type to use as a starting point for your new form. To copy an existing form:

  1. Click the Copy icon in the upper right corner.

  2. Select the Plan Type you would like to copy the form from.

    Copy_Form_From_Another_Plan_Type.png

  3. Click Yes to confirm that you would like to copy the form. The page will reload and the copied form settings will be

    Form_Copy_Confirmation.png

    Note

    Copying a Plan Details form from another Plan Type will overwrite any existing configuration you have done.

  4. Click Save.

Add, Edit, or Delete Form Sections

Sections make up the main layout of the Plan Details form.

Add Form Sections

  1. Click the Content button. This will open the Content panel on the right side of the screen.

  2. Go to the Sections tab of the Content panel.

    Click_Content_Icon_to_Open_Content_Panel.png

  3. Choose a section layout from the list, then drag and drop the section onto the form.

    Drag_and_Drop_Section_into_form.png

    Note

    You cannot change a section's layout after adding it to the form.

  4. Close the Content panel by clicking the X in the top right corner. Then click Save on the form.

    Save_the_form.png

  5. Click the kebab menu in the section header and select Edit. This will open the Edit Section form on the right side of the screen.

    Edit_Section.png

  6. Complete the Edit Section form.

    1. Configure the section header formatting.

      • Name: Enter a name for the new section.

      • Section Collapsed: Check the checkbox to have the section content collapsed by default.

      • Show Header: Check the checkbox to display the section header in the form.

      • Text Color: Use the color picker to select the text color for the section header.

        Color_Picker_Interface.png

      • Background Color: Use the color picker to select the background color for the section header.

      • Additional CSS: Enter any additional CSS formatting that you would like applied to the section.

    2. (Optional) Configure the column header formatting. Columns are components within a section.

      • Name: Enter a name for the column.

      • Text Color: Use the color picker to select the text color for the column header.

      • Background Color: Use the color picker to select the background color for the column header.

    Edit_Section_Form.png

  7. Click Update to apply your formatting to the form. Then close the Edit Section panel by clicking the X in the upper right corner.

  8. Click Save to save the changes to the form.

  9. Repeat steps 1-8 to add additional sections to the form.

Edit Form Sections

Click the kebab menu in the section header and select Edit. This will open the Edit Section form on the right side of the screen. Update the section formatting as needed, then click Update to apply your changes. Then click Save to save your updates to the form.

Edit_Section_After_Creation.png

Rearrange Form Sections

Click and hold the section header, then drag and drop the section to the desired location in the form. Then click Save to save your updates to the form.

Rearrange_Sections_in_Plan_Details_Form_Editor-VEED.gif

Delete Form Sections

Click the kebab menu in the section header and select Delete. Click Yes in the confirmation pop-up to delete the section.

Delete_Section.png

Add, Edit, or Remove Form Fields

Within the form sections, you can place form fields. These fields pull data from plan and summary fields across OnePlan.

  • Plan fields are independent fields that come from plans. These fields are inputted directly, and are not dependent on other fields.

  • Summary fields aggregate data from the plan fields below it (like a Rollup, see Manage Field Calculations for details).

Add Form Fields

  1. Click the Content button. This will open the Content panel on the right side of the screen.

  2. Go to the Elements tab of the Content panel.

  3. Click the drop-down menu and select the type of field you want to add into the form (Plan Fields or Summary Fields).

  4. Search for or locate the desired field. Then drag and drop the field into the desired section and column on the form. Repeat steps 4-5 until you have all of the fields you need in your form.

    Search_for_and_select_field_to_add_to_form.png

  5. Close the Content panel by clicking the X in the top right corner, then click Save on the form.

    Added_fields_save_form.png

Edit Form Fields

Click the pencil icon next to the desired field in the form. The Edit Field form will open. From this form, you can:

  • Hide the field label

  • Set the field height

Be sure to save the form once your updates are complete.

Edit_Field_Form.png

Remove Form Fields

Click the trash can icon next to the desired field. The field will be removed from the form. Be sure to save the form once your updates are complete.

Create, Add, Edit, or Remove Form Elements

Form elements include tables, child plans, text, and images.These add additional information to your form to improve the user experience. Once form elements are create, they function just like fields in the Form Editor.

Create a Form

  1. Click the Content button. This will open the Content panel on the right side of the screen.

  2. Go to the Elements tab of the Content panel.

  3. Click the drop-down menu and select the type of element you want to create (Tables, Child Plans, Images, Text).

  4. Click the New button. The Add [Element] form will open.

  5. Complete the Add [Element] form.

    • Add Table

      • Table Name: Enter a name for the table.

      • Work Type: Select Work Type to display in the table. For example, you can display a summary of Risks.

      • Plan Types: Select the Plan Types where the Work Type information will come from. For example you might want to select Project and Epic, so your table contains data related to those Plan Types.

      • Columns: Select the columns to include in the table.

      • Sort: Select the field/column to sort the table on.

      • Filter: Configure a filter to refine the data displayed in the table. For example, you could create a filter so the table only displays tasks with a status of In Progress.

      Add_Table_Element_Form.png

    • Add Child Plans

      • Table Name: Enter a name for the Child Plans table.

      • Lookup Field: Select the lookup field used to associate the child plans to the current plan type.

      • Plan Types: Select the Plan Types you want to pull into the table.

      • Columns: Select the columns to include in the table.

      • Sort: Select the field/column to sort the table on.

      • Filter: Configure a filter to refine the data dispalted in the table.

      Add_Child_Plan_Element_Form.png

    • Add Images

      • Name: Enter a name for the image.

      • URL: Paste the URL to the image. The image needs to be publically accessible to display on the form.

      • Align: Select the image alignment in the form column.

      • Width: Set the image width.

      • Height: Set the image height.

      Add_Image_Element_Form.png

    • Add Text

      • Text: Enter the text you want to display on the form.

      • Alignment: Select the text alignment.

      Add_Text_Element_Form.png

  6. Click Add. The element will now be available to add to the form from the Content panel.

Add, Edit, or Remove Form Elements

To add, edit, or remove an element in the form, follow the procedures in Add, Edit, or Remove Form Fields

Configure the Process Flow and Stage Gates

See Configure the Plan Details Process Flow for instructions on setting up the Plan Process Flow.

See Create or Edit Stage Gate Workflows for instructions on setting up Stage Gate Workflows for the different steps of the Process Flow.

JavaScript Customization

Plan detail forms are now even more customizable with JavaScript.

You can add buttons, validate forms, create rules can to make plan level fields required, hidden, or read only based on business logic. and more.

Contact OnePlan for more information and assistance with the JavaScript customizations.

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request