[MGNLUI-2600] Saving form should not be possible while an upload is in progress Created: 17/Jan/14  Updated: 09/Mar/21

Status: Open
Project: Magnolia UI
Component/s: dialogs, forms
Affects Version/s: 5.2.1, 6.2
Fix Version/s: 5.2.x

Type: Bug Priority: Neutral
Reporter: Joerg von Frantzius Assignee: Unassigned
Resolution: Unresolved Votes: 0
Labels: ux
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Attachments: Text File Example - upload in chooser dialog.bmml     PNG File Example - upload in chooser dialog.png     Text File Failed upload.bmml     PNG File Failed upload.png     Text File Ongoing upload.bmml     PNG File Ongoing upload.png    
Issue Links:
duplicate
duplicates MGNLUI-1012 "Save changes" should be disabled dur... Closed
Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Bug DoR:
[ ]* Steps to reproduce, expected, and actual results filled
[ ]* Affected version filled
Date of First Response:

 Description   

When uploading a large ZIP file, the Save and Cancel buttons are enabled and still have a mouseover that indicates something would happen when clicking on them.

It is undefined what should happen when clicking on the Save button during an ongoing upload, so it better shouldn't be possible at all. While MGNLUI-868 asks for the Dialog Cancel button to cancel the upload, this doesn't seem intuitive.

I think both Save and Cancel should be disable during upload, and there should be some other and more obvious way to cancel the ongoin upload?

Updated:
Ideally IMHO there should be an upload animation going on that makes it clear why save and cancel aren't enabled, even if user is jumping between tabs.

Also, it shouldn't be the Dialog Cancel button that cancels the upload, as that would mean that it changes its meaning (from canceling the dialog to canceling the upload and back). Maybe starting the upload could put a semi-transparent layer covering the dialog, containing both a progress animation and its own "Cancel"-button?



 Comments   
Comment by Mikaël Geljić [ 20/Jan/14 ]

Hi Joerg, thanks for your feedback.

Currently, if you press Save and the upload field is required, it'll trigger a validation error until upload is complete. If the field is not required, it will abort the upload while the dialog is being destroyed. Same as if you press Cancel.

Besides, one can still abort an ongoing upload by hitting the cross next to the progress bar.

We'll take a further look at this issue and comment again with our results and decisions.

Comment by Mikaël Geljić [ 23/Jan/14 ]

Here are our conclusions as discussed in UX group:

  • We don't disable dialog buttons - main ground: if you have an ongoing upload and have moved onto another tab it is not explicit why Save/Cancel is disabled.
  • We don't allow to save the form while an upload is in progress:
    • If user presses Save, we trigger a validation 'Warning' telling him to wait for upload to complete in order to Save. Our validation banners allow users to jump to tab where the issue is.
    • We might not have implemented validation 'Warning' so far (yellow background, black text), only validation 'Errors'. If so, an error is good enough for the time being.
    • Current behavior doesn't change for upload fields that are required.
Comment by Joerg von Frantzius [ 30/Jan/14 ]

Why enable a button that will only show a warning that it shouldn't be clicked? That's kinda funny. Show a button, user clicks it, and then tell him he shouldn't click it.

Ideally IMHO there should be an upload animation going on that makes it clear why save and cancel aren't enabled, even if user is jumping between tabs.

Comment by Andreas Weder [ 07/Feb/14 ]

Ok, so I've put some more thought into this. Here's my proposal.


Signal ongoing uploads

I'm thinking disabling the save button is a good thing, after all, if:

  1. We signal one or several uploads are still ongoing right next to the main buttons in the footer of a dialog. This explains why the "save" button is disabled. I don't want to show a modal alert for this, as I want the user to be able to continue working on other fields in the form.
  2. We signal on every tab with at least one running upload that uploads are ongoing in that tab.


Leave "Cancel" enabled at all times

I would still leave the "cancel" main button enabled. To ensure consistent behavior, however, clicking it always cancels both all running uploads and the dialog itself.

This is similar to how we (should) abort a main action in other instances as well. In the example below, where I show an asset chooser UI performing an upload, the actual upload can be cancelled by clicking on the "x" inside the alert reporting the progress. But you may also cancel the entire action plus the ongoing upload by clicking on "cancel".

Like this, "cancel" always works as expected and canceling the main action remains easy, even if several uploads are ongoing. I want to avoid asking the the user to go hunting for uploads to cancel only to enable that "cancel" button.


Signaling failed uploads

On more of a side note, if an upload fails, this is shown in the upload field itself as defined in the defining concept of a media upload field (see mockup 5b). In addition:

  • Any failed upload should be signaled as error on the tab where the upload field is hosted in
  • The save button is enabled again, if all uploads completed or failed.

For required upload fields, this should work well, if a user presses save:

  • The dialog will show an error message reminding the user that the upload is required
  • But the upload field itself will still show the error alert inside, signaling that the previous upload attempt has failed
Generated at Mon Feb 12 08:58:18 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.