updating form elements

This commit is contained in:
rolux 2011-12-30 15:03:01 +05:30
commit 73f1105692
13 changed files with 305 additions and 140 deletions

View file

@ -15,11 +15,8 @@ Ox.ObjectArrayInput = function(options, self) {
.options(options || {})
.addClass('OxObjectArrayInput');
if (self.options.value.length == 0) {
self.options.value = [{}];
self.options.inputs.forEach(function(input) {
self.options.value[0][input.options.id] = '';
});
if (Ox.isEmpty(self.options.value)) {
self.options.value = [getDefaultValue()];
}
self.$element = [];
@ -28,11 +25,10 @@ Ox.ObjectArrayInput = function(options, self) {
self.$addButton = [];
self.buttonWidth = self.options.width / 2 - 4;
self.options.value.forEach(function(value, i) {
addInput(i, value);
});
setValue(self.options.value);
function addInput(index, value) {
Ox.print('ADD INPUT', index, value)
self.$element.splice(index, 0, Ox.Element()
.css({
width: self.options.width + 'px',
@ -50,11 +46,16 @@ Ox.ObjectArrayInput = function(options, self) {
.bindEvent(input.events || {});
}),
labelWidth: self.options.labelWidth,
value: value,
width: self.options.width
})
.bindEvent({
change: function(data) {
// ...
var index = $(this).parent().data('index');
self.options.value[index] = self.$input[index].value();
that.triggerEvent('change', {
value: self.options.value
});
}
})
.appendTo(self.$element[index])
@ -70,6 +71,10 @@ Ox.ObjectArrayInput = function(options, self) {
var index = $(this).parent().data('index');
if (self.$input.length > 1) {
removeInput(index);
self.options.value = getValue();
that.triggerEvent('change', {
value: self.options.value
});
}
}
})
@ -84,7 +89,11 @@ Ox.ObjectArrayInput = function(options, self) {
.bind({
click: function() {
var index = $(this).parent().data('index');
addInput(index + 1);
addInput(index + 1, getDefaultValue());
self.options.value = getValue();
that.triggerEvent('change', {
value: self.options.value
});
}
})
.appendTo(self.$element[index])
@ -92,6 +101,20 @@ Ox.ObjectArrayInput = function(options, self) {
updateInputs();
}
function getDefaultValue() {
var value = {};
self.options.inputs.forEach(function(input) {
value[input.options.id] = '';
});
return value;
}
function getValue() {
return self.$input.map(function($input) {
return $input.value();
});
}
function removeInput(index) {
[
'input', 'removeButton', 'addButton', 'element'
@ -103,6 +126,16 @@ Ox.ObjectArrayInput = function(options, self) {
updateInputs();
}
function setValue(value) {
while (self.$element.length) {
removeInput(0);
}
value.forEach(function(value, i) {
addInput(i, value);
});
}
function updateInputs() {
var length = self.$element.length;
self.$element.forEach(function($element, i) {
@ -121,17 +154,10 @@ Ox.ObjectArrayInput = function(options, self) {
self.setOption = function(key, value) {
if (key == 'value') {
// ...
setValue(value);
}
};
// FIXME: remove
that.value = function() {
return self.$input.map(function($input) {
return $input.value();
});
};
return that;
};