A class implementing a one-way mapping from field elements to a javascript object and allowing to use more flexible change events. The idea is based on the datalinking plugin for jQuery.
<form id="form" action="" method="post">
<div><input name="radio" type="radio" value="radio1" /> radio1</div>
<div><input name="radio" type="radio" value="radio2" /> radio2</div>
<div><input name="checkbox" type="checkbox" value="checkbox1" /> checkbox1</div>
<div><input name="checkbox" type="checkbox" value="checkbox2" /> checkbox2</div>
<textarea name="textarea">textarea</textarea>
<textarea name="textarea2">textarea2</textarea>
</form>
var o = {
radio: 'radio1',
checkbox: ['checkbox1', 'checkbox2'],
textarea: null
};
//bind and assign the data to the fields
$('form').bindObject(o);
//bind and do not assign the data to the fields, use textarea2 instead of textarea
$('form').bindObject(o, {
mapping: {
textarea: '[name=textarea2]' //any selector would be accepted
},
assign: false
});
//unbind
$('form').unbindObject(o);
//assign the data to the fields without any binding
$('form').assignObject(o);
//still accept mapping options for custom selectors
//any other options will be ignored
$('form').assignObject(o, {
mapping: {
textarea: '[name=textarea2]' //any selector would be accepted
}
});
var o = {
radio: 'radio1',
checkbox: ['checkbox1', 'checkbox2'],
textarea: null
};
//bind with a global change event and a specific change event for the radio property
$('form').bindObject(o, {
onChange: function(event, obj, key, oldValue, el) {
console.log(arguments);
},
onChangeradio: function(event, obj, key, oldValue, el) {
console.log(arguments);
}
});
A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.
Found a bug in this plugin? Please report it this repository's Github Issues.
blog comments powered by Disqus