3

Suppose a UI with a list of editable texts, and with a search feature (searching text contents) like this mockup:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Since searching in data with unsaved changes might be rather unpredicatable, my question is:

How to handle search when there are unsaved changes?

  • Should the search field be disabled until the user clicks Save changes?
  • When the search field receives focus, should the user be prompted to save changes?
  • ...?
3

My opinion is that the text must be saved to be 'part' of searchable data. That is a standard approach. If for some reason, there is a requirement for you to be able to search unsaved text also, then its a different thing.

On search focus, you can 'auto save' or 'prompt-save' or just plain ignore the unsaved changes in your search results. But searching only saved data seems right.

Disabling search and too much prompting for unsaved changes... will cause work flow issues, who likes to be interrupted ?

  • 1
    Your point about interruptions is spot on! – Franchesca Jan 13 '16 at 22:45
2

There are a couple of aspects to this. One is adding a list item, other is editing a list item.

If you are adding a list item, once it is added it is saved. Now that item can be searched for.

If you are editing, let there be an edit view where the search field will display results for all the editable and non-editable item(s).

Prompting to save the results when focused on the search field might not give a very good user experience. Some cases where prompt can be used:

  1. User has not saved the changes and is trying to navigate somewhere else
  2. Confirmation(sort of)

Now, when the user clicks on the search field there is no such situation where there should be a prompt shown. The user is not doing something which will cause the unsaved data to be removed.

A better approach to this whole scenario would be to provide a edit view which will be meant just for editing. It will also have a search field which can be used to search over a list of editable/non-editable items. This way, a more focused design can be achieved and there would be less chances for the user to make a mistake. And if the user is navigating out of the edit view before saving it, you can show an alert saying "There are changes unsaved. Do you want to save it?"

Isolation can help project the design clearly. When the user enters the edit mode, move to a view where the list items are editable. Once it is saved, get back to the normal view. This way the user can search on data based on the view which is currently active.

Hope I could help with some thoughts if not the solution.

Edit details: Changed answer to provide search on both edit and normal view.

  • Why not also have searching / filtering on what you refer to as the "edit view"? I have implemented something like this before, and if you also include a toggle to filter for only edited rows it can be really handy for previewing changes to large data sets. – Franchesca Jan 13 '16 at 22:50
  • On a second thought, yes. It will be a good idea to add a search field for the edit view. Based on the mode, the search field can be used. Thanks for your view. I will add this up in the answer. – DarkBlaze Jan 14 '16 at 4:49
  • While a focused, separate edit view would have it's benefits, it also has it's drawbacks (general confusion about "modeful" UIs), so I'm aiming at inline edit. – agib Jan 14 '16 at 8:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.