Customizing the Start Speed of List View Search

Overview

When searching a Sidecar module's list view, Sugar® begins returning results automatically once a predefined number of milliseconds have passed. This article covers how to customize the start speed of the list view search for Sidecar modules in Sugar.

Prerequisites

This change requires code-level customizations, and you will need direct access to the server in order to make the necessary changes in the file system. If you already have a relationship with a Sugar partner, you can work with them to make this customization. If not, please refer to the Partner Page to find a reselling partner to help with your development needs. 

Note: If your instance is hosted in Sugar's cloud environment, you can create a package that can be installed within Admin > Module Loader. For more information, please refer to the Creating an Installable Package That Copies Files article. 

Note: Sugar Sell Essentials customers do not have the ability to upload custom file packages to Sugar using Module Loader.

Use Case

By default, the list view search process in Sugar begins to run 400 milliseconds after a user stops typing or pasting values into one of the search fields. For some users or situations, the system-defined start speed for list view search may be considered too fast. We will walk through increasing the length of time it takes before the search starts to run, using 750 milliseconds as an example.

Steps to Complete

The function that controls the list view search speed in Sugar can be found in the following file: ./clients/base/views/filter-quicksearch/filter-quicksearch.js In order to customize this function, please use the following steps to create an extension in the ./custom/ directory:

1. Navigate to the ./custom/ directory in the Sugar file system and create the following directory structure if it does not already exist: ./clients/base/views/filter-quicksearch/.
2. In a text editor application, create a new file.
3. Copy the code provided below into this new file:
   

   ({
     extendsFrom: 'FilterQuicksearchView',
   
     /**
      * @override
      * @param {Object} opts
      */
     initialize: function(opts) {
         this._super('initialize', [opts]);
     },
   
     /**
      * Fire quick search
      * @param {Event} e
      */
       throttledSearch: _.debounce(function(e) {
         var newSearch = this.$el.val();
         if(this.currentSearch !== newSearch) {
             this.currentSearch = newSearch;
             this.layout.trigger('filter:apply', newSearch);
         }
       }, 750),
   })

4. For our example, the value of "750" at the end of the code represents the new start speed of list view search. Feel free to replace it with your desired value in milliseconds.
5. Save the new file as./custom/clients/base/views/filter-quicksearch/filter-quicksearch.js.
6. Update the Ownership and Permissions of the directories and file that were created.
   • For more information on Linux based stacks, please refer to the article Required File System Permissions on Linux.
   • For more information on Windows-based stacks, please refer to the article Required File System Permissions on Windows With IIS.
7. Finally, log into Sugar and navigate to Admin > Repair then perform a "Quick Repair and Rebuild".

After completing the steps in this article, Sugar will wait 750 milliseconds before returning search results once the user has stopped entering search criteria.