forked from 0x2620/oxjs
updating form elements
This commit is contained in:
parent
8550cc8442
commit
73f1105692
13 changed files with 305 additions and 140 deletions
|
|
@ -25,7 +25,10 @@ Ox.Form = function(options, self) {
|
|||
items: [],
|
||||
// FIXME: don't pass function,
|
||||
// listen to event instead!
|
||||
submit: null
|
||||
submit: null,
|
||||
validate: function(valid) {
|
||||
return Ox.every(valid);
|
||||
}
|
||||
})
|
||||
.options(options || {}) // fixme: the || {} can be done once, in the options function
|
||||
.addClass('OxForm');
|
||||
|
|
@ -33,20 +36,14 @@ Ox.Form = function(options, self) {
|
|||
Ox.extend(self, {
|
||||
$items: [],
|
||||
$messages: [],
|
||||
formIsValid: false,
|
||||
itemIds: [],
|
||||
itemIsValid: []
|
||||
});
|
||||
|
||||
self.options.items.forEach(function(item, i) {
|
||||
var validateItem = item.options('validate');
|
||||
if (validateItem) {
|
||||
validateItem(item.value(), function(data) {
|
||||
self.itemIsValid[i] = data.valid;
|
||||
});
|
||||
} else {
|
||||
self.itemIsValid[i] = item.value !== '';
|
||||
}
|
||||
validateItem(i, function(valid) {
|
||||
self.itemIsValid[i] = valid;
|
||||
});
|
||||
self.itemIds[i] = item.options('id') || item.id;
|
||||
self.$items[i] = Ox.FormItem({element: item}).appendTo(that);
|
||||
item.bindEvent({
|
||||
|
|
@ -79,6 +76,9 @@ Ox.Form = function(options, self) {
|
|||
id: self.itemIds[i],
|
||||
data: data
|
||||
});
|
||||
validateItem(i, function(valid) {
|
||||
validateForm(i, valid);
|
||||
});
|
||||
},
|
||||
submit: function(data) {
|
||||
self.formIsValid && that.submit();
|
||||
|
|
@ -95,6 +95,8 @@ Ox.Form = function(options, self) {
|
|||
});
|
||||
});
|
||||
|
||||
self.formIsValid = self.options.validate(self.itemIsValid);
|
||||
|
||||
function getItemIndexById(id) {
|
||||
return self.itemIds.indexOf(id);
|
||||
}
|
||||
|
|
@ -107,8 +109,7 @@ Ox.Form = function(options, self) {
|
|||
|
||||
function validateForm(pos, valid) {
|
||||
self.itemIsValid[pos] = valid;
|
||||
Ox.Log('Form', 'VALID???', self.itemIsValid)
|
||||
if (Ox.every(self.itemIsValid) != self.formIsValid) {
|
||||
if (self.options.validate(self.itemIsValid) != self.formIsValid) {
|
||||
self.formIsValid = !self.formIsValid;
|
||||
that.triggerEvent('validate', {
|
||||
valid: self.formIsValid
|
||||
|
|
@ -116,6 +117,18 @@ Ox.Form = function(options, self) {
|
|||
}
|
||||
}
|
||||
|
||||
function validateItem(pos, callback) {
|
||||
var item = self.options.items[pos],
|
||||
validate = item.options('validate');
|
||||
if (validate) {
|
||||
validate(item.value(), function(data) {
|
||||
callback(data.valid);
|
||||
});
|
||||
} else {
|
||||
callback(item.value && !Ox.isEmpty(item.value));
|
||||
}
|
||||
}
|
||||
|
||||
that.addItem = function(pos, item) {
|
||||
Ox.Log('Form', 'addItem', pos)
|
||||
self.options.items.splice(pos, 0, item);
|
||||
|
|
@ -138,6 +151,10 @@ Ox.Form = function(options, self) {
|
|||
self.options.submit(that.values(), submitCallback);
|
||||
};
|
||||
|
||||
that.valid = function() {
|
||||
return self.formIsValid;
|
||||
};
|
||||
|
||||
that.values = function() { // fixme: can this be private?
|
||||
/*
|
||||
get/set form values
|
||||
|
|
@ -147,9 +164,8 @@ Ox.Form = function(options, self) {
|
|||
var values = {};
|
||||
if (arguments.length == 0) {
|
||||
self.$items.forEach(function($item, i) {
|
||||
//Ox.print('??????-??', self.itemIds[i], self.$items[i].value(), Ox.typeOf(self.$items[i].value()))
|
||||
values[self.itemIds[i]] = self.$items[i].value();
|
||||
//fixme: make the following work
|
||||
//values[self.itemIds[i]] = self.$items[i].value();
|
||||
});
|
||||
//Ox.Log('Form', 'VALUES', values)
|
||||
return values;
|
||||
|
|
@ -157,7 +173,7 @@ Ox.Form = function(options, self) {
|
|||
Ox.Log('Form', 'SET FORM VALUES', arguments[0])
|
||||
Ox.forEach(arguments[0], function(value, key) {
|
||||
var index = getItemIndexById(key);
|
||||
//index > -1 && Ox.Log('Form', ':::::::', key, value)
|
||||
index > -1 && Ox.Log('Form', ':::::::', key, value)
|
||||
index > -1 && self.options.items[index].value(value);
|
||||
});
|
||||
return that;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue