Page MenuHomePhabricator

🐛 UX Bug | Don't clear Wunschbetrag on refocus & Number formatting
Open, LowPublic

Description

When

  • I see a mobile/ipad banner in any language, e.g. this one
  • And I click "Jetzt spenden"
  • And I enter "5.60" as Wunschbetrag
  • And I click somewhere else

Then

  • on mobile banners the field is formatted as "5,6 €"⚡️
  • on de-ipad banner the field is formatted as "5.60 €"⚡️

but I would want to have it formatted as "5,60 €" (two digits precision, correct separator in German)

And when

  • I want to change my Wunschbetrag

Then the field is cleared of by pervious input ⚡️ but I would expect it to keep the input, less the Euro sign so that it is easy to edit the number, i.e. "5,60".

When

  • I leave the field (click somewhere else) after re-editing my Wunschbetrag

Then the Wunschbetrag should be formatted again, i.e. correct precision digits and the adding the currency symbol

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald Transcript
chrp renamed this task from 🐛 UX Bug | Don't clear Wunschbetrag on refocus to 🐛 UX Bug | Don't clear Wunschbetrag on refocus & Number formatting.Nov 25 2019, 11:36 AM
chrp updated the task description. (Show Details)
chrp updated the task description. (Show Details)
chrp moved this task from Incubation to Heap on the WMDE-FUN-Funban-2019 board.

The correct, consistent and language-specific formatting of "Wunschbetrag" is in PR 271, but not integrated in EN banners and current ipad banner. It will be implemented gradually in the next tests.

The requirement of "amount does not go away and is editable" needs some UX input IMHO. This is a mobile-specific behavior and as such I think it was introduced intentionally. I find it more convenient to type an amount again on mobile than having to painstakingly move my cursor (Apple has made that even harder with iOS 13) or press backspace multiple times. What do you think, @Jan_Dittrich ?

It seems that keeping the value in the field is the standard, thus I would suggest also keeping the numbers. (or in general: Do whatever the standard input-for-numbers behavior on the device is)
The larger problem might be that we attach a €-Character directly to the input, which leads to confusing appearances and disappearances of the € and makes hitting the right spot with your cursor harder (since "after the number" needs to be in the small spot "before the €"). Biggest gain for the field is getting rid of overwriting the value and showing the € via CSS.