Implement element bindings for setting attribute values on model objects.

@@ -2,15 +2,16 @@
 (function() {
 
   window.rivets = (function() {
-    var attr, bindableAttributes, bindings, getInputValue, registerBinding, setAttribute, _fn, _i, _len;
+    var attr, bidirectionalBindings, bindableAttributes, bindings, getInputValue, registerBinding, setAttribute, _fn, _i, _len;
     registerBinding = function(el, adapter, type, context, keypath) {
-      var inputValue;
       bindings[type](el, adapter.read(context, keypath));
       adapter.subscribe(context, keypath, function(value) {
         return bindings[type](el, value);
       });
-      if (inputValue = getInputValue(el)) {
-        return adapter.publish(context, keypath, inputValue);
+      if (_.include(bidirectionalBindings, type)) {
+        return $(el).bind('change', function() {
+          return adapter.publish(context, keypath, getInputValue(this));
+        });
       }
     };
     setAttribute = function(el, attr, value, mirrored) {
@@ -29,9 +30,9 @@
         case 'textarea':
         case 'password':
         case 'select-one':
-          return $(this).val();
+          return $(el).val();
         case 'checkbox':
-          return $(this).is(':checked');
+          return $(el).is(':checked');
       }
     };
     bindings = {
@@ -74,6 +75,7 @@
         return $(el).val(value);
       }
     };
+    bidirectionalBindings = ['value', 'checked', 'unchecked', 'selected', 'unselected'];
     bindableAttributes = ['id', 'class', 'name', 'src', 'href', 'alt', 'title', 'placeholder'];
     _fn = function(attr) {
       return bindings[attr] = function(el, value) {

@@ -10,8 +10,9 @@ window.rivets = do ->
     adapter.subscribe context, keypath, (value) ->
       bindings[type] el, value
 
-    if inputValue = getInputValue el
-      adapter.publish context, keypath, inputValue
+    if _.include bidirectionalBindings, type
+      $(el).bind 'change', ->
+        adapter.publish context, keypath, getInputValue(this)
 
   setAttribute = (el, attr, value, mirrored=false) ->
     if value
@@ -21,8 +22,8 @@ window.rivets = do ->
 
   getInputValue = (el) ->
     switch $(el).attr 'type'
-      when 'text', 'textarea', 'password', 'select-one' then $(this).val()
-      when 'checkbox' then $(this).is ':checked'
+      when 'text', 'textarea', 'password', 'select-one' then $(el).val()
+      when 'checkbox' then $(el).is ':checked'
 
   bindings =
     show: (el, value) ->
@@ -46,6 +47,7 @@ window.rivets = do ->
     value: (el, value) ->
       $(el).val value
 
+  bidirectionalBindings = ['value', 'checked', 'unchecked', 'selected', 'unselected']
   bindableAttributes = ['id', 'class', 'name', 'src', 'href', 'alt', 'title', 'placeholder']
 
   for attr in bindableAttributes