Jump to new table row added from popup

I haven't hit a wall yet but perhaps someone could help me avoid it completely.

I have a Perspective table displaying database data. An Add new button opens a popup, the user enters the data and hits Save. This runs a named query update to insert the new row in the database and the Id column will auto-increment making it the last row (on an Id sort). All OK so far.

The sensible user experience would be to show and highlight the new row in the table on the view. But...

  • A refresh binding will jump back to the first row (and first page if pager is enabled). Meanwhile the new row is at the end on the last page.
  • I could add a row to the table's props.data but how would I jump to that row?
  • The user may have column sorting.

Any ideas for something that's intuitive to the user?

When I do something similar, I have done it three different ways:

  1. always sort newest to oldest so new record is always at the top.
  2. set the table filter text property so only the new row is displayed. Clearing the filter will go back to the previous sorting.
  3. use a separate “single row” table bound to the selected row data of the full table. This could be hidden after a certain amount of time after entry.

Victor has some JS magic for this too [Feature-789] Perspective component extensibility - Ignition - Inductive Automation Forum