Last Updated: February 25, 2016
·
659
· bbarr

Always preventDefault with RivetsJS

Avoid mucking up your controller/view/viewModel/etc with DOM-business by asking RivetsJS to preventDefault for you.

Just add this to your rivets configuration:

rivets.binders['with-default-on-*'] = rivets.binders['on-*']

rivets.binders['on-*'] = {
  "function": true,
  routine: function(el, value) {
    rivets.binders['with-default-on-*'].routine.call(this, el, function(e) {
      e.preventDefault(); 
      value.call(this, e); 
    });
  }
}

This will now silently preventDefault, allowing your view logic to be un-DOM-ified:

<button data-on-click="myHandler"></button>

And in the case that you want native functionality in addition to your callback:

<button data-with-default-on-click=myHandler"></button>

Have a fresh tip? Share with Coderwall community!

Post
Post a tip
Did you know?

JavaScript on a page runs with the privileges of that origin. One altered library, tag manager, or snippet can read inputs, change what people see, and call your APIs as the user.

Security insights from Cside