I am making a online-survey. One of the questions is :

How much do you want to invest next year ?

The numbers can vary between 1000 - 100000€.

I provide a normal input textfield, but the problem is that if a big company inputs 10000 instead of 100000 the error is very huge.

The survey is also in paper format and it looks like this :


Is it possible to do something similar, or is there another technique I can use to minimize the chance of errors?

  • Related - ux.stackexchange.com/questions/22292/… - though that one only mentions overpayment. Here you are concerned with underpayment too. – ChrisF Jun 14 '12 at 12:40
  • I thought the answer on the question ChrisF mentions that you should write out the number in text below the input field was an excellent idea i.e. it would say "zero" and then update to "three thousand" (dynamically as the user types). That gives immeadiate feedback. Could be in grey very subtle. – Lisa Tweedie Jun 14 '12 at 12:45

Option 1: "Emulating paper"

Enhance the textfield (via JS) so that the number entered is dynamically formatted with thousands and decimal separators.

This solution would be quite similar to what you have in the pen-and-paper representation, actually.

Option 2: "You probably don't care about the exact amount anyways"

Since you mentioned that the use case in question is a survey, you'll probably be grouping results anyways, right?

So, assuming you don't really need a precise number but rather an estimate or a range, you could use:

  • a (range) slider – which actually would work pretty well even for precise numbers
  • a set of radiobuttons representing ranges [$0 - 10k], [$10k - 20k], …
  • a dropdown working in the same way as the radio buttons – additionally saving you some space and making the form look less extensive to the user

Personally, I would probably go with the slider. People love them :p

  • Slider idea is a very good one... that keeps the context of the range. – Lisa Tweedie Jun 14 '12 at 12:48
  • The slider tied to a numeric field could also be useful (if you couldn't enhance the textfield). That way you could do precise input, but if you weren't paying attention to the zeros, the slider would alert you to the fact that you put 10x more (or less) money than you meant. – Wayne Werner Jun 14 '12 at 13:37
  • 1
    For option 1, you could use a plugin like digitalbush.com/projects/masked-input-plugin to format the value with commas. – Mike Eng Jun 14 '12 at 16:38

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.