Customize “Update Multiple Leads” dialog

The “Update Leads” tool, in case you didn’t know, is a dialog accessed from a tasklet on the Leads list view. It allows user to make updates to the selected leads within a group.

Update Leads

Now out of the box there are only 2 fields available: Owner and Account Manager. How do we go about adding a new field? It turns out that this is not totally straightforward as the tool is actually hard-coded to these 2 fields. We are going to have to monkey-patch the UpdateLeads.js file and for each field we want to add we will need to:

  • load the property using loadUpdateableProperties in the constructor
  • build the UI for the property editor in show
  • show / hide our custom property editor (or editors) in _propertyChanged
  • update getPropertySelectionValue to have it return the new property name and value

The good news is the back-end processing (a job service job called UpdateEntityJob) is coded in a generic way and won’t necessitate any update.

I am going to code an example to add 2 fields to the update options:

  • Lead Qualifier – this is a custom user lookup
  • Status picklist

Setting Things Up

I am going to put the code for the customization in a new file, CustomizeUpdateLeads.js, and load that file via a module (CustomizeUpdateLeadsModule) that is loaded on the Leads page. Check out Including Custom Javascript in Saleslogix if you are not familiar with that technique.

This is how I am starting my javascript:

require(['dojo/aspect', 'Sage/MainView/Lead/UpdateLeads'],
    function (aspect, UpdateLeads) {        
        // custom stuff will go here
    });

Load New Properties

We can intercept the postMixInProperties call to load those:

aspect.after(UpdateLeads.prototype, 'postMixInProperties', function() {
    this.loadUpdateableProperties('LeadQualifier', 'Lead Qualifier');
    this.loadUpdateableProperties('Status', 'Status');
});

OK, so far so good, but that was the easy part.

Build the UI

This can be where most of the complexity is.

The LeadQualifier property is easy because it’s a user lookup and we can use the existing “account manager” one. So there is actually nothing to do for it!

The Status is just a bit harder – we need to build a new picklist for it, so I need to require some additional modules, and add some code in the show method:

require(['dojo/aspect', 'Sage/MainView/Lead/UpdateLeads', 'Sage/UI/Controls/SingleSelectPickList', 'dojo/dom-construct'],
    function (aspect, UpdateLeads, SingleSelectPickList, domConstruct) {
        // ...
        aspect.after(UpdateLeads.prototype, 'show', function () {
            var pkl = new SingleSelectPickList({
                className: 'display-none',
                style: 'padding: 8px 0',
                pickListName: 'Lead Status'
            });
            domConstruct.place(pkl.domNode, this.divAcctMgrContainer, 'after');
            this.pklStatus = pkl;
        });

Show/Hide the custom property editor

We’ll use the _propertyChanged event handler for this. This is called when the user selects a different property in the dropdown.

aspect.after(UpdateLeads.prototype, '_propertyChanged', function () {
            var selectedProperty = this.propertyNameSelect.value;
            if (selectedProperty == 'LeadQualifier') {
                this.setDisplayProperty(this.divAcctMgrContainer, true);
            }
            this.setDisplayProperty(this.pklStatus.domNode, selectedProperty == 'Status');
        });

Retrieve selection

We can intercept the getPropertySelectionValue call to handle the case of the custom property being selected. Be sure to pass the value returned by the original function if the property name does not match (hence “return value” at the end).

// retrieve selection for custom properties
aspect.after(UpdateLeads.prototype, 'getPropertySelectionValue', function (value) {
    var selectedProperty = this.propertyNameSelect.value;
    switch (selectedProperty) {
        case 'LeadQualifier':
            if (this.lup_AcctMgr.selectedObject) {
                return { name: 'LeadQualifier', value: this.lup_AcctMgr.selectedObject.$key };
            }
            break;
        case 'Status':
            if (this.pklStatus.get('value')) {
                return { name: 'Status', value: this.pklStatus.get('value') }
            }
            break;
    }
    return value;
});

Wrapping Up – Code Download

I would like to have this widget be more generic but it works well for the purpose! I have made the code available on Github, though you’ll have to customize the paths and such to integrate it into your codebase.

Leave a Reply

Your email address will not be published. Required fields are marked *