Catch on-click event on checkboxes

Question

I try to get the click on a checkbox using RactiveJS, as follows:

HTML:

<input type='checkbox' on-change-input-click="toggle">

JS:

toggle : function(){
    treatment()
}

The toggle function never gets called.

Why would I like to catch the toggle event? Because once the checkbox toggled, other components must be changed. More precisely, this is a checkbox in a tree. Toggling a checkbox in a tree node toggles the descendants nodes.

Maybe there is another event than change, input or click I missed...

The complete code is in this fiddle.

Answer 1

Your fiddle is using version 0.3.7, in that version only proxy events are supported and there was no init event in which to subscribe, and there were no array methods on ractive itself. So you'd need to do something like:

ractive.on('toggle', function(){
    this.get("clicked").push("clicked!");
});

Latest is version is 0.6.1, but you still have an issue with your code. If you want to call a method on the ractive instance, you need to invoke it in the handler:

HTML:

<input type='checkbox' on-change="toggle()">

JS:

toggle: function(){
    treatment()
}

If you want to raise an event, you need to subscribe to that proxy name:

HTML:

<input type='checkbox' on-change="toggle">

JS:

oninit: function(){
    this.on('toggle', function(){
        treatment()
    });
}