Opened 13 years ago

Closed 9 years ago

#7510 closed enhancement (patchwelcome)

Menu: show multi-column menu off of DropDownButton etc.

Reported by: David Schwartz Owned by: Douglas Hays
Priority: high Milestone: future
Component: Dijit Version: 1.1.1
Keywords: ibm DropDownButton multiple columns Cc:
Blocked By: Blocking:


There are times when a large number of choices is available within a menu. While there are generally means of avoiding this, occasions do arise when they are necessary.

DropDownButton? should allow for multiple columns of choices as in:

Attachments (2)

flyout05.jpg (38.7 KB) - added by David Schwartz 13 years ago.
dojo-multi-col-menu.gif (8.2 KB) - added by David Schwartz 12 years ago.

Download all attachments as: .zip

Change History (7)

Changed 13 years ago by David Schwartz

Attachment: flyout05.jpg added

comment:1 Changed 13 years ago by bill

Component: GeneralDijit
Milestone: tbd1.3
Owner: anonymous deleted
Summary: DropDownButton choices are limited to a single columnMenu: show multi-column menu off of DropDownButton etc.
Type: defectenhancement

This would actually be an enhancement to the Menu widget. Not sure what exactly the spec would be, probably the items would flow like:

1                 6
2                 7
3                 8
4                 9
5                 10

rather than

1                2
3                4
5                6

comment:2 Changed 13 years ago by bill

Milestone: 1.3future

I've thought about this a bit more... it's more complicated than I initially considered.

The first question is keyboard support... how does the user navigate between entries in the left and right columns? I assume using the left/right arrow keys. But then, what if there is a submenu off of one of the choices in the left column? Perhaps we just don't support nested menus.

This also opens the question of what the layout rules are. Does it show up like a table with entries in the left and right columns aligned? They might become misaligned if left column has a thin separator bar, or a larger font for one of the menu items.

Also note that a full implementation would need to handle addChild()/removeChild() which would need to reflow the existing items (when an item was added/removed from the middle of the list).

Changed 12 years ago by David Schwartz

Attachment: dojo-multi-col-menu.gif added

comment:3 Changed 12 years ago by David Schwartz

The main purpose is to provide a flat list as in the example above or a site map in which there might be headings and indented items within the sections as in the figure below. In the flat listing, CursorUp? and CursorDown? would follow the first pattern you documented above. I think it would be fine not to support nested menus here.

[[Image( [dojo-multi-col-menu.gif])]]

Regarding this figure, CursorRight? from Heading 2 or Choice 2.1 would move the focus to Heading 4 (the spaces are not cursorable). Accordingly, CursorDown? from Choice 1.2 moves the focus to Heading 2. CursorDown? from Choice 2.3 moves the cursor to Heading 3.

comment:4 Changed 10 years ago by bill

Component: DijitDijit - Form
Owner: set to Douglas Hays

comment:5 Changed 9 years ago by bill

Component: Dijit - FormDijit
Resolution: patchwelcome
Status: newclosed

Hmm, not sure why I marked this as "Dijit - Form" or assigned to Doug. Anyway I am marking as "patch welcome" since we don't have any plans to implement this. I'm also not sure it would go into dijit/, rather than dojox/form.

Note: See TracTickets for help on using tickets.