Convert Lead - convert-main.js -  handleSave - app.alert.show

Question

Hi all,

I want perform some checks before converting a lead to contact.

In some cases I want to confirm the user to save before "Save and convert" gets executed and show him a Alert for that (app.alert.show).

I build the sugarcrm/custom/modules/Leads/clients/base/layouts/convert-main/convert-main.js file with this code.

The if-Statement works, and also the this._super('handleSave'); in the else case, but not in onConfirm action:

({
    extendsFrom: 'LeadsConvertMainLayout',

    initialize: function(options) {
        this._super('initialize',[options]);
        this.context.on('lead:convert:save', this.handleSave, this);
    },

    handleSave: function() {
       //
       // do some things ...
       //

      if (XYZ == true) {
            app.alert.show('myconfirm-msg', {
                level: 'confirmation',
                messages: 'Please confirm to save!',
                autoClose: false,
                onConfirm: function(){
                    this._super('handleSave'); 
                    // perform the normal handleSave -> this don't work
                },
                onCancel: function(){
                    // do nothing
                }
            });
      } else {
          this._super('handleSave'); // perform the normal handleSave - this works
      }
    },
})

Can you please help me how to solve this.

Many Thanks

Sven

Sven Waldinger · Accepted Answer

I suspect that this is related to JavaScript language behavior. The onConfirm callback function is called using a different context. So the value of 'this' is different from within the onConfirm callback function than it is when it's part of the handleSave function.

There's a couple different patterns you can use to solve this problem.

One is save the context from the handleSave function to a variable and use that within the onConfirm callback.

    handleSave: function() {
        ...
            var self = this;

            app.alert.show('myconfirm-msg', {
                level: 'confirmation',
                messages: 'Please confirm to save!',
                autoClose: false,
                onConfirm: function(){
                    self._super('handleSave'); 
                    // perform the normal handleSave -> this don't work
                },
                onCancel: function(){
                    // do nothing
                }
            });
        ...
    }

The other is to use _.bind(). See https://underscorejs.org/#bind

    handleSave: function() {
        ...

            app.alert.show('myconfirm-msg', {
                level: 'confirmation',
                messages: 'Please confirm to save!',
                autoClose: false,
                onConfirm: _.bind(function(){
                    this._super('handleSave'); 
                    // perform the normal handleSave -> this don't work
                }, this),
                onCancel: function(){
                    // do nothing
                }
            });
        ...
    }

Excuse any typos above.

App Ecosystem @ SugarCRM