Skip to content

Implement a UI mechanism for advanced object selection #10054

@jeremystretch

Description

@jeremystretch

NetBox version

v3.3.0

Feature type

New functionality

Proposed functionality

This FR seeks to provide the user a more convenient and obvious method for selecting a related object when creating and editing NetBox object.

For example, when creating a new device, the user must select a site and may select a location and/or rack within that site. To aid the user in selecting a site, NetBox provides drop-down selections to filter by region and site group:

Screenshot 2022-08-17 at 15-46-02 Add a new device NetBox

However, it is not obvious to the user that the site, location, and rack fields are attributes of the device, whereas region and site group are not. Ideally, the region and site group selections should be moved to a hidden modal that can be summoned if needed when selecting the site. I envision the following workflow:

  1. User clicks a button to create a new device
  2. User begins searching for the desired site
  3. If found, user selects the site and moves on. Otherwise, user clicks a "filter" button next to the site field, which opens a simple modal containing drop-down selections for region, site group, and site.
  4. User selects the desired region or site group, then finds the desired site from the filtered list.
  5. User dismisses the modal, and the desired site is now selected in the device form.

I expect that we can render the modal via standard utility views rendered using HTMX requests for minimal overhead.

Use case

Abstracting the fields which exist solely for filtering has several benefits:

  • The filters can be removed from form classes (as they do not play a direct role in object creation/modification)
  • It is more clear to the user exactly which attributes they are actually defining on the object
  • Screen space is saved by removing unneeded filters (e.g. in cases where searching for the related object suffices)
  • It will become more feasible to offer direct "add" links for child objects that were previously accessible only via a parent object (e.g. device components)

Database changes

No response

External dependencies

No response

Metadata

Metadata

Assignees

Labels

status: acceptedThis issue has been accepted for implementationtype: featureIntroduction of new functionality to the application

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions