XF 2.2 data-xf-click on xf:toggle fires multiple times

[asprin]

So I've a data-xf-click defined on a xf:toggle inside a loop.

<xf:foreach loop="$data" value="$obj">
    <xf:toggle name="abc[]" data-xf-click="foo" value="{{$obj.sys_id}}" />
</xf:foreach>

And the javascript is as follows:

var AsprinFB = window.AsprinFB || {};

/** @param {jQuery} $ */
!(function($, window, document, _undefined) {
    'use strict';
     
    AsprinFB.ClickHandler = XF.Click.newHandler({
        eventType: 'click',
        eventNameSpace: 'AsprinFBClickHandler',  
        init: function() {    
            console.log('initialised');
        },

        click: function(event) {                              
              console.log('clicked');
        }
    });

    XF.Click.register('foo', 'AsprinFB.ClickHandler');
})(jQuery, window, document);

Now when I click on a checkbox, this is what the console looks like:


So initialised runs 2 times and click 4 times. Is there a way to prevent them from firing multiple times on the first click?

 

[digitalpoint]

Normally you wouldn't attack a click handler to the <xf:toggle> tag. Instead, the submit="true" attribute is used to tell XenForo to submit the form it's in when it's toggled. So unless you need a special click handler to fire when it's clicked (but not necessarily changed), I wouldn't use one.

<xf:toggle name="abc[]" value="{{$obj.sys_id}}" submit="true" />

 

[asprin]

That's true. I do have to do something when the checkbox gets checked (but not trigger a form submit), so can't use the submit attribute. Guess I'll simply replace it with the HTML that the tag generates and try attaching the event to the checkbox itself.