...
Move buttons (right and left), shown between the two lists. These allow the user to move items between the lists.
Reorder buttons (up and down), shown underneath the Chosen Columns list. These allow the user the reorder the chosen items.
A “Up to X” indicator, shown next to the Chosen Columns header (optional - if a maximum number of chosen items was set).
A search bar above each list (optional). This allows the user to quickly locate specific items. The search bar is optional, depending on the number of items.
A vertical scrollbar, used where the list is too long to be displayed in its container.
A Restore defaults button (optional), shown in the bottom-left corner of the dialog box.
Done Apply and Canceldialog buttons, shown in the bottom-right corner of the dialog box.
...
Where defined, users can pin any column on the Chosen Columns list by clicking the pin icon, which is shown on hover. In this case:
the icon toggles from pinned to unpinned.
the item moves to the top of the list.
the item can be ordered only inside the group of pinned items.
within a data table, pinned columns are anchored to the left. Pinned columns can be reordered only inside the group of pinned columns.
The user can unpin the item by clicking the pin icon again.
Validation and Errors
...
All
...
items were removed
If the user removes all items from the Selected Chosen Columns list:
the search bar and , reordering buttons and the Apply will be disabled.
a message will appear inside the container, advising the user to select at least one item.
 |
In this case, clicking the Done button:
shows an error message at the bottom of the dialog.
disables the button.
...
Exceeding the maximum number of columns
It is recommended to limit the number of items which can be selected, depending on common usage and system performance.
In this case, the maximum number of items should be shown with the count above the Selected Columns list, regardless of the number of available columns.
If the user reaches the maximum number of items:
the right arrow button will be disabled.
dragging items from the Available Columns list will be disabled.
a relevant message will appear at the bottom of the popup.
...