[](https://badge.fury.io/js/voxjs)
Small and simply two way data binding and validator
Usage
-------------
Javascript:
var myObject = {
name: "myname",
active: true,
inner: {
foo: 'bar'
},
option: 2
};
Vox.binder.init()
Vox.validation.init()
##Html:
When bind object it can automatically set convert the value type to int, float, string or currency (formated).
##Binding table to array
Table changes when use push, pop, or splice the binded array.
HTML:
Javascript:
var myArr = [{
'name': 'name1',
'age': 21,
'inner': {
'foo': 'bar1'
}
}, {
'name': 'name2',
'age': 22,
'inner': {
'foo': 'bar2'
}
} ];
Vox.binder.bindTable(myArr, 'myTable', ['name', 'age', 'inner.foo']);
myArr.push({'name':'test', 'age':20, 'inner':{'foo':'bar_test'}})
##Validation:
* vox-required="true" - required
* vox-pattern="regex" - validation based on regex
* vox-message="Invalid name" - invalid message
Validation returns 'message' or 'element':
Vox.validation.validateAll().forEach(function(e) {
alert(e.message);
});
##AJAX (get, post, put, delete):
Returns success, error or then (used for both);
Vox.ajax.get(URL, DATA).success(function(response){
console.log(response);
}).error(function(err) {
console.log(err);
});
##Locale
Html - if vox-label is in input, set label as placeholder else set inner value
Javascript:
var ptBr = {
name: 'pt-br',
data: {
'insert_name': 'Insira o nome',
inner: {
'insert_text': 'Insira o texto'
}
}
}
var en = {
name: 'en',
data: {
'insert_name': 'Insert Name',
inner: {
'insert_text': 'Insert text'
}
}
}
Vox.locale.setLanguage(en);
[](https://badge.fury.io/js/voxjs)
Small and simply two way data binding and validator
Usage
-------------
Javascript:
var myObject = {
name: "myname",
active: true,
inner: {
foo: 'bar'
},
option: 2
};
Vox.binder.init()
Vox.validation.init()
##Html:
When bind object it can automatically set convert the value type to int, float, string or currency (formated).
##Binding table to array
Table changes when use push, pop, or splice the binded array.
HTML: