Skip to content

Instantly share code, notes, and snippets.

@lukeclifton
Created September 24, 2018 22:27
Show Gist options
  • Save lukeclifton/46ab5189b12554550d1097b365a7c698 to your computer and use it in GitHub Desktop.
Save lukeclifton/46ab5189b12554550d1097b365a7c698 to your computer and use it in GitHub Desktop.
jQuery Two Way Data Binding Example
<input id="input" type="text">
<br>
This is the message: <span id="output"></span>
<script type="text/javascript">
var $input = $('#input');
var $output = $('#output');
// A controller for getting/setting the bound variable
var message = {
content: null,
get: function() {
return this.content;
},
set: function(val) {
this.content = val;
$output.html(val);
$input.val(val);
}
};
// Listens for changes in input
$input.on("keyup", function() {
message.set($(this).val());
});
message.set('jQuery data binding is far less sexy.');
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment