Rivets stops working with some libraries after Sightglass was introduced

Question

i'm using rivets with jQuery.mask plugin, but after Sightglass was introduced, it doesn't update backbone model.

I've prepared two fiddles to demonstrate the issue.

http://jsfiddle.net/sf3jz718/

$("input").blur(function(){
    $("#log").html(phone.attributes.phone)
})

• here when we fill in the form to fit the mask, and then lose focus, we'll see its content in "#log" div.

http://jsfiddle.net/vmn3zn84/

rivets.adapters[':'] = {
  observe: function(obj, keypath, callback) {
    obj.on('change:' + keypath, callback)
  },
  unobserve: function(obj, keypath, callback) {
    obj.off('change:' + keypath, callback)
  },
  get: function(obj, keypath) {
    return obj.get(keypath)
  },
  set: function(obj, keypath, value) {
    obj.set(keypath, value)
  }
}

• this example - with latest rivets adapter, and it just doesn't update the model.

What causes such behaviour? Thanks

Answer 1

I've received comprehensive answer from https://github.com/Duder-onomy

hi @aagafonov I was able to get your fiddle working. The important diff to notice about your 2 examples. In the latest rivets, the value binder listens to the input event and not the change event like it used too. You can see that code in rivets source here.

http://jsfiddle.net/vmn3zn84/3/

$("input").mask("(999) 999-9999", {
    completed : function() { 
        this.trigger('input');
    }    
});

That being said, the input masking library you are using is not firing proper DOM events. I had to put a completed listener on that input mask. When that listener fires it will this.trigger('input'). That will kick off all of the binding. Please note, the masking library you are using will only fire the completed event when the entire mask is completed (typing in all 10 numbers).

This brings up an interesting point. When using libraries that do not follow html events spec you will almost always have to trigger the proper events yourself. This is always frustrating to me as it looks like rivets is broken...but it almost never (in my experience) is broken...just the old school jquery libraries that didn't care to maintain spec.

Hope this helps!