What should happen when I add a Row to a paginated, sorted list

Question

A user wants to add an item on a sorted and paginated List. If we keep the list sorted, the item might be on another page than we're viewing and if we just add it to the top of the list it will break the sorting.

The best solution I can think of is to add the item to the top of the list and have an unsorted state until the user sorts again.

Any alternatives?

UPDATE: Users can add items in bulk too! And you sort the list by clicking on the header of each column (like a table)

Answer 1

This is always tricky, but I think you could implement a list view as in StackExchange User Reputation League. Even if an item isn't added by a user per see, it could be used in your case as well. Add the newly added item to the top of the list keeping the sorting/filtering options intact. But make clear that this is not a part of the filter/sort by changing background color. That way the user know there's something different with that list item. Refreshing the sort - the item goes back to where it should be in the filtered/sorted list.

On this image - I'm at rank 22, but still listed highest with a different background color.

Another option would be to push the last item of the current list to the next page, adding your newly added item to the bottom instead. But that depends on if users add items from the bottom or from the top.

Answer 2

Is there any benefit in adding the items inline? It seems a new dialog for adding items can serve multiple benefits:

• Solves the issue of how to handle pagination
• Allows you to perform business logic/validation on new entries
• Potentially the problem of bulk adding also easier to handle (for example, allow users to duplicate an added item to allow for minimal re-entry if items can have one or more duplicate values)

Then, when the "add item(s)" dialog is completed the table can update as normal with the recently added items in the table on whatever page they may fall on. If there's value in seeing new items, you may choose to make them stand out in some way (perhaps highlighting like the screenshot in Benny's answer)

Answer 3

Here is my advice :

My preferred solution :

Add the new item at the end of the list, but separated from the other items, with something like a dashed line. And on a light yellow background. So that the user know that the new item is not part of the sorted group.

Another solution can be :

Add the new item at the end of the list, and put the list in “not sorted” state. That is : remove the triangle in the key header, remove the “pushed” state of the key header…

Answer 4

Add the new item at the top (for clear feedback that the operation succeeded) then ask the user if they want to update the sort (for clear feedback on the change in state of the list; i.e. now unsorted)