0

What's the best way to simulate a troolean variable with an HTML form?

Specifically, I've got a column that is to be sorted, so it can have three states: unsorted, ascending, and descending. I want to store the state in a form so it is recovered after page submission.

Is there an elegant way of doing this?

EDIT

Javascript is encouraged here. Right now my solution is a hidden input, with a value of 0,1, or 2. The value is changed when the sort button is clicked, and submitted with the form. But perhaps there's a better way?

EDIT

This question has apparently already been asked: Tri-state Check box in HTML?. Voting to close.

Community
  • 1
  • 1
Ben
  • 54,723
  • 49
  • 178
  • 224
  • 1
    Is "troolean" a commonly accepted term? – Thom Smith Nov 23 '10 at 05:43
  • Perhaps not - is there a different way to express it? I'm ripping it from the Win32 API for a variable with three states (true/false/error). – Ben Nov 23 '10 at 05:55
  • 3
    I thought the canonical "troolean" values were ["true, false, file not found"](http://thedailywtf.com/Articles/Classic_WTF_-_What_is_Truth_0x3f_.aspx)... – Jim Lewis Nov 23 '10 at 05:58
  • 1
    I would say [tri-state](http://en.wikipedia.org/wiki/Three-state_logic) for such things. And in Python we'd just say `True`, `False` and `None`, generally. If you need a fourth, `Ellipsis` tends to be it. :-) – Chris Morgan Nov 23 '10 at 06:38
  • possible duplicate of [Tri-state Check box in HTML?](http://stackoverflow.com/questions/1726096/tri-state-check-box-in-html) – Ben Nov 23 '10 at 07:17

3 Answers3

1

Either using 3 radio boxes or a select list with 3 elements.

Ben Rowe
  • 28,406
  • 6
  • 55
  • 75
1

Don't go for the magic numbers. As long as the data's going as text over HTTP anyway, you might as well just use values of "ascending", "descending", and "unsorted" or empty.

And a radio button would probably be the thing. Select is overkill for three elements. If you want a different interface, you can use javascript to hide the radio buttons for those with scripting enabled.

Thom Smith
  • 13,916
  • 6
  • 45
  • 91
  • Yeah, don't use `select`, whatever you do. I reckon that for up to about five (sometimes more), selects are unfriendly - you only get to see one value so you may not be able to tell what the other values are, and it requires two clicks rather than one (and keyboard accessibility of selects is sometimes dodgy, especially when you don't get to see the options so have no idea how many options there are). Don't call it overkill for three options - call it bad design! – Chris Morgan Nov 23 '10 at 06:44
0

I find the way the top checkbox of gmail is working rather intuitive:

  • if no items are selected, the checkbox is empty
  • if at least an item is selected, the checkbox is selected and has an opacity of 0.5
  • if all items are selected, the checkbox is selected with opacity 1

You don't need an image like the referenced page about the Tristate checkbox.

Mic
  • 24,812
  • 9
  • 57
  • 70
  • Thanks Mic, that is on the road to what I'm looking for. Gives me some new ideas to try at any rate. – Ben Nov 24 '10 at 05:31