Automatically Setting Focus to the Search Textbox in Lookups in Infor CRM Web

An annoyance I’ve always had when using the Infor CRM (Saleslogix) Web client is that in lookup dialogs the textbox where you type in a search value is not focused. You can’t just open a lookup and start typing. You have to first click into the textbox, then type in your search value. In my opinion this textbox should always be focused by default, allowing you to just start typing. Fortunately, it’s easy enough to change this behavior with some custom Javascript.

Here’s the code to change that behavior in all Lookups. I should add, this also changes this behavior in the search lookup in groups as well 👍🏻 (the dialog that shows when you click the magnifying glass icon in the top left of the groups list).

require([
    'dojo/aspect',
    'Sage/UI/SearchConditionWidget'
], function (
    aspect, 
    SearchConditionWidget
) {
   
    aspect.after(SearchConditionWidget.prototype, 'startup', function() {
        var self = this;
        var intId = setInterval(function() {
            if (self._valueBox) {
                clearInterval(intId);
                var setFocus = function() { self._valueBox.focus(); };
                setFocus(); setTimeout(setFocus, 200);
            }
        }, 100);
    });
 
});

What this code is doing is it wires up some code to fire after the SearchConditionWidget is created (that is the widget that produces the field, operator, & search value controls in the lookup dialog). Once that widget is created, it waits until the search textbox is actually created (the widget itself executes a simulate to create the controls, so it needs to make sure that is actually done and the controls are added to the dom). Then, it sets the focus to the textbox. Note, the reason why it sets the focus, and then uses setTimeout to set it again in 200 milliseconds is because a dojo dialog will automatically attempt to set focus to the first focusable element (with tabindex=0). So, just in case the timing of that steals focus again, we do it a second time to be sure.

Here’s what that looks like when you have that code in place. Notice how the cursor always is set in the search textbox, just as you’d expect it to be.

Much nicer.

To use the code above, I would recommend using our free Custom Loader Module. Once, that is installed, go to the SlxClient portal and select the SupportFiles tab, open the Custom\Modules folder. Then create a new folder named “Lookups” and create a file named “main.js” inside of that and paste in the code from above. If you’re not using the Custom Loader Module (really, you should be. It makes things so much easier), then you’ll need to wire up the code above in the base.master (or just add it in there enclosed in script tags).

ABOUT THE AUTHOR

Ryan Farley

Ryan Farley is the Director of Development for Customer FX and creator of slxdeveloper.com. He’s been blogging regularly about SalesLogix since 2001 and believes in sharing with the community. He loves C#, Javascript, Python, web development, open source, and Linux. He also loves his hobby as an amateur filmmaker.

Submit a Comment

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

Subscribe To Our Newsletter

Join our mailing list to receive the latest Infor CRM (Saleslogix) news and product updates!

You have Successfully Subscribed!