What is the proper way to target a button event?

Hello. I am trying to add a button to the "+" menu in Quotes, left hand side, where you add a QLI line, a comment etc.

The button is added in custom/modules/Quotes/clients/base/views/quote-data-grand-totals-header/quote-data-grand-totals-header.php like this:

[
'type'=>'button',
'placeholder'=>'Custom pricing ALL',
'label'=>'Custom pricing ALL',
'name'=>"custom_pricing_bulk",
'icon'=>'fa-plus',
]
to the viewdef array.

As you can see, the button is named: custom_pricing_bulk. When I try to attach an on click event to it using:
custom/modules/Quotes/clients/base/views/quote-data-grand-totals-header/quote-data-grand-totals-header.js
it fails to trigger
extendsFrom: "QuotesQuoteDataGrandTotalsHeaderView",
initialize: function(options) {
this._super('initialize', [options]);
this.context.on('button:custom_pricing_bulk:click', this._onCustomPricingBulk, this);
}

Alternatively, I also tried:
options.def.events = _.extend({}, options.def.events, {
  'click [name="custom_pricing_bulk"]': '_onCustomPricingBulk'
});
this._super('initialize', [options]);

but no luck. Where have I went wrong?
Parents Reply
  • I made it working yesterday by copying the events array into the custom JS file and then extending. Simple problem: it is very hard to find what area is what in the file system. I found the + menu simply because we customized that to not allow adding QLI if there is no billing account selected. I have no idea how to target the 3-dot menu. Also no idea how to "retrieve" programatically only the selected items. Documentation is kind of lacking, so I used what already existed

Children