Tag Info

New answers tagged

1

Rather than completely focus on input widget, in addition to widget an in process correction UI would be very strong. download bmml source – Wireframes created with Balsamiq Mockups


0

What you need is a searchable dropdown/select list. The distinction between your example is that the area you type for searching is NOT the data entry field, and only serves to present a list of options. If you click the dropdown to expand it, type in the search field, and then click away without selecting anything, then the selection does not change and ...


1

While digging around the site, I came across two other ideas in this question that allow input of only valid values: Slider A slider that can be dragged in different speeds (idea and image by JonW): Benefits flexible intervals possible (i.e. +20 between 200 and 500, +50 when value is over 500) faster increase/decrease of the value by dragging further ...


3

How about a design like this? download bmml source – Wireframes created with Balsamiq Mockups You allow the user to enter any number he wants into the "ideal bid" textbox, but automatically display in the disabled "actual bid" textbox the nearest increment (rounding down so as not to make the user pay more than he intended).


5

I personally am a fan of what Windows has been doing lately with numeric inputs: When you enter something invalid, it shows a "tooltip" type popup that tells you of the error. Obviously, the message for your control would be something akin to "The bid must be a multiple of 20€"


5

In HTML5, the input element supports the step attribute. Example: http://jsfiddle.net/yhffroa1/ However, not all browsers support it yet. IE in particular doesn't have spinner buttons for <input type="number">, and mobile browsers don't respect step at all. There is also the pattern attribute that applies the :valid/:invalid pseudoclasses as ...


29

I came up with another way to handle this scenario which is more clear in cases with arbitrary jumps. 1. Show links below the text input to quickly convey how the bidding system works by listing valid choices which can be chosen with a single click right from the start. 2. Update valid choices as the user types or clicks The user can either type 68 or ...


2

If you are not space constrained, allow user to enter whatever value they wish and then round it to the nearest allowed value. The reason this needs space is that you will need to not only show the actual allowed value, but show an explanation of what is going on. Something like: Your bid To prevent arbitrary bids with small increases prolonging auctions ...


4

To make sure users only select and don't enter anything, you would need to remove entry form, because it's encouraging people to enter things into it. Alternatively, I would set current bid as default and only let users choose from values like "$445 (+$15), $460 (+$30), etc". set current bid as a default and give user a list of options from +$10 (or ...


25

I recently was playing around with a new type of pager control that only uses numbers and doesn't require any localization (next, previous, last, first, all function without any words required in the UI) I modified it slightly to work in your case here. The idea is to be really clear to the user up front that they can't just type anything they want because ...


1

An autocomplete that is not editable As you type it narrows down the choices (simply a filter) If only numbers are valid then just throw out keystrokes that are not valid If they type in a sequence that is not valid then you simply have no valid choices An enter key is used to denote the user accepts the current selection Tab key is next item from the valid ...



Top 50 recent answers are included