2

My app is a SPA (single page application) which currently loads reports as soon as they are visited, and each time a filter is updated. Because of performance issues on the backend, I need to change this so that the data only loads after filters are chosen and a 'Generate Report' button is clicked.

I'm trying to figure out the best way to notify a user once they've changed a filter that they need to click the 'Generate Report' button again. I could initially disable it until a filter is selected, because that will make a noticeable change to the button when it's re-enabled but I'm not sure what to do after that. I was thinking some sort of animation on the button each time a filter is changed - like maybe temporarily making it brighter or temporarily dimming it. I haven't been able to find good examples of how to handle this. Any help is appreciated

Improve this question
2
  • 2
    Where does this functionality reside? Is it in line with the rest of the page? Would it be possible to move the possible filter criteria to a modal window? That has the benefit of forcing the user to make an explicit choice and cannot leave the filter in this "unapplied" state. The user would have to either apply changes to the filter or cancel changing the filter in order to close the modal.
    – maxathousand
    Commented Jul 10, 2018 at 21:55
  • The functionality is inline (a top banner) great idea about the modal!
    – Robin Schaaf
    Commented Jul 11, 2018 at 13:52

3 Answers 3

Reset to default
1

When filters have been set but not submitted, you could make the content (the report) gray and place an action (kind of button) on top of the content asking the user to generate the new content (new report).

Scenario:

  1. User changes filter.
  2. The "old" content (reports) is grayed out.
  3. A button appears on top of the content (reports), with a call-to-action "apply filters" (with an option to cancel).

So basically, when you change the filter, the content is being invalidated. By graying out the content emphasis is given to the submit button.

Improve this answer
0

What @maxathousand said: Put the filter settings in a modal dialog, which forces the user to click the "Generate Report" button to apply the settings. Or, spy the filters and when they are "dirty" (different from what is being displayed), dim the report display and highlight the "Generate Report" button, so that the user knows what to do to apply the new filter settings.

Improve this answer
0

I've been working on a complete service in generating reports and I think using:

1- Gray button of the filter properties didn't change

enter image description here

2- Green button if any filter property changed

enter image description here

But must know something, the moment you clicked the green button to generate your filter you have to disable the button and turn it to gray and make the whole filter area to be disabled, to prevent any change during the processing time.

Add a feature for your report in case you are using this filter a lot. Place a save button and give your filter a name to be used regularly instead of creating it from scratch every time.

Add a feature Also you can make your filter featured by having this switcher also

enter image description here

So each time you enter your report service, it shows you this filter as your default filter.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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