0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

fix some Select/MenuButton bugs

Browse source
This commit is contained in:
rlx 2011-12-20 07:29:14 +00:00
parent 96b206de1a
commit cf567e5608
2 changed files with 31 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
source/Ox.UI/js/Form/Ox.Select.js
View file

@ -17,6 +17,7 @@ Ox.Select <f:Ox.Element> Select Object
maxWidth <n|0> Maximum menu width
min <n|1> Minimum number of selected items
overlap <s|'none'> Can be 'none', 'left' or 'right'
selectable <b|true> is selectable
size <s|'medium'> Size, can be small, medium, large
style <s|'rounded'> Style ('rounded' or 'square')
title <s|''> Select title
@ -47,6 +48,7 @@ Ox.Select = function(options, self) {
maxWidth: 0,
min: 1,
overlap: 'none', // can be none, left or right
selectable: true,
size: 'medium',
style: 'rounded',
title: '',
@ -69,20 +71,22 @@ Ox.Select = function(options, self) {
width: self.options.width - 2 + 'px'
})
.bindEvent({
click: showMenu,
anyclick: showMenu,
key_escape: loseFocus,
key_down: showMenu
});
Ox.Log('Form', 'Ox.Select', self.options);
self.optionGroup = new Ox.OptionGroup(
self.options.items,
self.options.min,
self.options.max
);
self.options.items = self.optionGroup.init();
self.checked = self.optionGroup.checked();
if (self.options.selectable) {
self.optionGroup = new Ox.OptionGroup(
self.options.items,
self.options.min,
self.options.max
);
self.options.items = self.optionGroup.init();
self.checked = self.optionGroup.checked();
}
if (self.options.label) {
self.$label = Ox.Label({
@ -123,12 +127,12 @@ Ox.Select = function(options, self) {
self.$menu = Ox.Menu({
element: self.$title || self.$button,
id: self.options.id + 'Menu',
items: [{
items: [self.options.selectable ? {
group: self.options.id + 'Group',
items: self.options.items,
max: self.options.max,
min: self.options.min
}],
} : self.options.items],
maxWidth: self.options.maxWidth,
side: 'bottom', // FIXME: should be edge
size: self.options.size
@ -147,15 +151,19 @@ Ox.Select = function(options, self) {
function changeMenu(data) {
//Ox.Log('Form', 'clickMenu: ', self.options.id, data)
self.checked = self.optionGroup.checked();
self.options.value = data.checked.length ? data.checked[0].id : '';
self.$title && self.$title.html(
self.options.title ? self.options.title : data.checked[0].title
);
that.triggerEvent('change', {
selected: data.checked,
value: self.options.value
});
if (self.options.selectable) {
self.checked = self.optionGroup.checked();
self.options.value = data.checked.length ? data.checked[0].id : '';
self.$title && self.$title.html(
self.options.title ? self.options.title : data.checked[0].title
);
that.triggerEvent('change', {
selected: data.checked,
value: self.options.value
});
} else {
that.triggerEvent('click', data);
}
}
function getTitleWidth() {
@ -224,12 +232,12 @@ Ox.Select = function(options, self) {
() -> <o> returns object of selected items with id, title
@*/
that.selected = function() {
return self.optionGroup.checked().map(function(v) {
return self.options.selectable ? self.optionGroup.checked().map(function(v) {
return {
id: self.options.items[v].id,
title: self.options.items[v].title
};
});
}) : [];
};
/*@

4
source/Ox.UI/js/Menu/Ox.MenuButton.js
View file

@ -39,13 +39,13 @@ Ox.MenuButton = function(options, self) {
})
.options(options || {})
.addClass(
'OxMenuButton Ox' + Ox.toTitleCase(self.options.style)
'OxSelect Ox' + Ox.toTitleCase(self.options.style)
)
.css(self.options.width == 'auto' ? {} : {
width: self.options.width - 2 + 'px'
})
.bindEvent({
click: showMenu
anyclick: showMenu
});
if (self.options.type == 'text') {