gmac / backbone.epoxy

Declarative data binding and computed models for Backbone
http://epoxyjs.org
MIT License
615 stars 89 forks source link

how to have a toggle button #101

Closed patrick-radius closed 10 years ago

patrick-radius commented 10 years ago

Hi,

i'm trying to figure this out. We have a <button> element, and want it to toggle a boolean model value on click... How to do this?

we now have this binding:

 '#visibleInSearch': "toggleButton:visibleInSearch, text:visibleText, classes:{'btn-primary':visibleInSearch},events:['click']",

but the handlers get function never gets called.

Is there a way to define the events valid for that handler in the handler itself?

gmac commented 10 years ago

I'm not sure I understand the question. First, it looks like you're either using a custom binding handler, or else are (probably) getting an error. There is no built-in binding for toggleButton. I think what you're trying to do is something like this:

var MySearchView = Backbone.Epoxy.View.extend({
    bindings: {
        '#visibleInSearch': 'visible: visibleInSearch, text: visibleText',
    },

    events: {
       'click #visibleInSearch': 'onVisInSearch'
   },
   onVisInSearch: function() {}
});
patrick-radius commented 10 years ago

The idea was that a button element is just like any other form element with a value attribute and all. So i was hoping i could do a binding with that so purely toggling a value with a button can be a lot cleaner.

Also in the example you're giving the button would dissapear if the binding is true-ish. That's not what i want... i only want to toggle the value with the button.