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

blur editing

Browse source
This commit is contained in:
j 2012-01-10 01:55:38 +05:30
commit ba9423462f
8 changed files with 180 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

72
source/Ox.UI/js/Form/Ox.ArrayEditable.js
View file

@ -16,6 +16,7 @@ Ox.ArrayEditable = function(options, self) {
items: [],
position: -1,
selected: '',
submitOnBlur: true,
type: 'input',
width: 256
})
@ -43,14 +44,26 @@ Ox.ArrayEditable = function(options, self) {
var $target = $(e.target),
$parent = $target.parent(),
position = $parent.data('position');
!$target.is('.OxInput') && that.gainFocus();
if ($parent.is('.OxEditableElement')) {
selectItem(
e.metaKey && position == self.selected
? -1 : $parent.data('position')
);
} else {
selectNone();
//ignore clicks while editing
if (!$target.is('.OxInput')) {
if (self.selected > -1) {
//end editing but keep selected if clicked next to a keyword
if (self.editing || self.$items[self.selected].options('editing')) {
self.editing = false;
self.$items[self.selected].options({editing: false});
//deselect if not editing and not going to select antoher one
} else if (!$parent.is('.OxEditableElement')) {
selectNone();
}
}
//select if clicked on other editable element
if ($parent.is('.OxEditableElement')) {
selectItem(
e.metaKey && position == self.selected
? '' : $parent.data('position')
);
}
that.gainFocus();
}
}
@ -103,6 +116,7 @@ Ox.ArrayEditable = function(options, self) {
format: function(value) {
return value || ' '
},
submitOnBlur: self.options.submitOnBlur,
tooltip: 'Click to select' + (
item.editable ? ', doubleclick to edit' : ''
),
@ -113,13 +127,18 @@ Ox.ArrayEditable = function(options, self) {
.addClass(item.id == self.options.selected ? 'OxSelected' : '')
.data({position: i})
.bindEvent({
blur: function(data) {
that.triggerEvent('blur', data);
},
cancel: function(data) {
},
edit: function(data) {
self.editing = true;
that.triggerEvent('edit', data);
},
submit: function(data) {
Ox.Log("AE", "SUBMIT", data);
submit(i, data.value);
}
})
@ -131,10 +150,17 @@ Ox.ArrayEditable = function(options, self) {
self.selected > -1 && selectItem(0);
}
function selectItem(position) {
self.selected = position;
self.options.selected = getSelectedId();
that.selectItem(self.options.selected);
function selectItem(idOrPosition) {
if (Ox.isString(idOrPosition)) {
self.options.selected = idOrPosition;
self.selected = getSelectedPosition();
} else {
self.selected = idOrPosition;
self.options.selected = getSelectedId();
}
that.find('.OxSelected').removeClass('OxSelected');
self.selected > -1 && self.$items[self.selected].addClass('OxSelected');
that.triggerEvent('select', {id: self.options.selected});
}
function selectLast() {
@ -158,9 +184,12 @@ Ox.ArrayEditable = function(options, self) {
function submit(position, value) {
var item = self.options.items[position];
if (value === '') {
deleteItem();
} else {
item.value != value && that.triggerEvent('submit', {
} /*else if (item.value === value) {
that.triggerEvent('blur');
} else*/ {
that.triggerEvent('submit', {
id: item.id,
value: value
});
@ -172,7 +201,7 @@ Ox.ArrayEditable = function(options, self) {
if (key == 'items') {
renderItems();
} else if (key == 'selected') {
that.selectItem(value);
selectItem(value);
}
}
@ -190,17 +219,16 @@ Ox.ArrayEditable = function(options, self) {
*/
};
that.editItem = function(position) {
selectItem(position);
editItem();
that.blurItem = function() {
Ox.Log('AE', 'bI', self.selected);
self.selected > -1 && self.$items[self.selected].options({editing: false});
};
that.selectItem = function(id) {
that.editItem = function(id) {
Ox.Log('AE', 'editItem', id);
self.options.selected = id;
self.selected = getSelectedPosition();
that.find('.OxSelected').removeClass('OxSelected');
self.selected > -1 && self.$items[self.selected].addClass('OxSelected');
that.triggerEvent('select', {id: self.options.selected});
editItem();
};
that.removeItem = function(position) {