allow for max width in menus
This commit is contained in:
parent
4bb3196c03
commit
16556c0604
4 changed files with 11 additions and 0 deletions
|
@ -1173,6 +1173,7 @@ Lists
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
.OxTextList .OxHead .OxTitle img {
|
.OxTextList .OxHead .OxTitle img {
|
||||||
|
display: block;
|
||||||
width: 10px;
|
width: 10px;
|
||||||
height: 10px;
|
height: 10px;
|
||||||
margin: 1px 0 0 -1px;
|
margin: 1px 0 0 -1px;
|
||||||
|
@ -1248,6 +1249,7 @@ Lists
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
.OxTextList .OxItem .OxCell > img {
|
.OxTextList .OxItem .OxCell > img {
|
||||||
|
display: block;
|
||||||
width: 16px;
|
width: 16px;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
margin: -1px 0 0 -4px;
|
margin: -1px 0 0 -4px;
|
||||||
|
@ -1528,6 +1530,8 @@ Menus
|
||||||
}
|
}
|
||||||
.OxMenu .OxItem .OxCell.OxTitle {
|
.OxMenu .OxItem .OxCell.OxTitle {
|
||||||
padding-left: 4px;
|
padding-left: 4px;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
overflow: hidden;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
.OxMenu .OxItem .OxCell.OxModifiers {
|
.OxMenu .OxItem .OxCell.OxModifiers {
|
||||||
|
|
|
@ -13,6 +13,7 @@ Ox.Input <f:Ox.Element> Input Element
|
||||||
autocompleteReplaceCorrect <b> if true, only valid values can be entered
|
autocompleteReplaceCorrect <b> if true, only valid values can be entered
|
||||||
autocompleteSelect <b> if true, menu is displayed
|
autocompleteSelect <b> if true, menu is displayed
|
||||||
autocompleteSelectHighlight <b> if true, value in menu is highlighted
|
autocompleteSelectHighlight <b> if true, value in menu is highlighted
|
||||||
|
autocompleteSelectMaxWidth <n|0> Maximum width of autocomplete menu, or 0
|
||||||
autocompleteSelectSubmit <b> if true, submit input on menu selection
|
autocompleteSelectSubmit <b> if true, submit input on menu selection
|
||||||
autocorrect <s|r|f|null> ('email', 'float', 'int', 'phone', 'url'), or
|
autocorrect <s|r|f|null> ('email', 'float', 'int', 'phone', 'url'), or
|
||||||
<r> regexp(value), or
|
<r> regexp(value), or
|
||||||
|
@ -73,6 +74,7 @@ Ox.Input = function(options, self) {
|
||||||
autocompleteSelect: false,
|
autocompleteSelect: false,
|
||||||
autocompleteSelectHighlight: false,
|
autocompleteSelectHighlight: false,
|
||||||
autocompleteSelectMax: 0,
|
autocompleteSelectMax: 0,
|
||||||
|
autocompleteSelectMaxWidth: 0,
|
||||||
autocompleteSelectSubmit: false,
|
autocompleteSelectSubmit: false,
|
||||||
autovalidate: null,
|
autovalidate: null,
|
||||||
changeOnKeypress: false,
|
changeOnKeypress: false,
|
||||||
|
@ -424,6 +426,7 @@ Ox.Input = function(options, self) {
|
||||||
var menu = Ox.Menu({
|
var menu = Ox.Menu({
|
||||||
element: self.$input,
|
element: self.$input,
|
||||||
id: self.options.id + 'Menu', // fixme: we do this in other places ... are we doing it the same way? var name?,
|
id: self.options.id + 'Menu', // fixme: we do this in other places ... are we doing it the same way? var name?,
|
||||||
|
maxWidth: self.options.autocompleteSelectMaxWidth,
|
||||||
offset: {
|
offset: {
|
||||||
left: 4,
|
left: 4,
|
||||||
top: 0
|
top: 0
|
||||||
|
|
|
@ -35,6 +35,7 @@ Ox.Menu = function(options, self) {
|
||||||
id: '',
|
id: '',
|
||||||
items: [],
|
items: [],
|
||||||
mainmenu: null,
|
mainmenu: null,
|
||||||
|
maxWidth: 0,
|
||||||
offset: {
|
offset: {
|
||||||
left: 0,
|
left: 0,
|
||||||
top: 0
|
top: 0
|
||||||
|
@ -198,6 +199,7 @@ Ox.Menu = function(options, self) {
|
||||||
var position;
|
var position;
|
||||||
if ('id' in item) {
|
if ('id' in item) {
|
||||||
that.items.push(Ox.MenuItem(Ox.extend(item, {
|
that.items.push(Ox.MenuItem(Ox.extend(item, {
|
||||||
|
maxWidth: self.options.maxWidth,
|
||||||
menu: that,
|
menu: that,
|
||||||
position: position = that.items.length
|
position: position = that.items.length
|
||||||
})).data('position', position).appendTo(that.$content)); // fixme: jquery bug when passing {position: position}? does not return the object?;
|
})).data('position', position).appendTo(that.$content)); // fixme: jquery bug when passing {position: position}? does not return the object?;
|
||||||
|
|
|
@ -32,6 +32,7 @@ Ox.MenuItem = function(options, self) {
|
||||||
id: '',
|
id: '',
|
||||||
items: [],
|
items: [],
|
||||||
keyboard: '',
|
keyboard: '',
|
||||||
|
maxWidth: 0,
|
||||||
menu: null, // fixme: is passing the menu to 100s of menu items really memory-neutral?
|
menu: null, // fixme: is passing the menu to 100s of menu items really memory-neutral?
|
||||||
position: 0,
|
position: 0,
|
||||||
title: [],
|
title: [],
|
||||||
|
@ -70,6 +71,7 @@ Ox.MenuItem = function(options, self) {
|
||||||
.append(
|
.append(
|
||||||
that.$title = $('<td>', {
|
that.$title = $('<td>', {
|
||||||
'class': 'OxCell OxTitle',
|
'class': 'OxCell OxTitle',
|
||||||
|
css: self.options.maxWidth ? {maxWidth: self.options.maxWidth} : {},
|
||||||
html: self.options.title[0]
|
html: self.options.title[0]
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in a new issue