How to use Autocomplete feature in Dynamics 365?

Got a requirement to show the list of countries on an Contact form with Autocomplete feature in Dynamics 365.

Already i have a “Country” Master entity with the below main fields,

AutoComplete - Country Fields

Click here to download the Country Master records.

On Contact Entity, used existing field “address1_country“.

Configured the below function on Onload of Contact Entity Main form,

Click hereSELRES_372e7e03-79a1-4051-afee-ab2bea51b4c9SELRES_2fa84526-7748-4dd0-9a45-989ec80b4b72SELRES_f20c5529-027c-4d76-8825-16f2d86e4a42SELRES_58d7c2ce-5d68-4b68-bcf3-9d6bec1d7e2fSELRES_58d7c2ce-5d68-4b68-bcf3-9d6bec1d7e2fSELRES_f20c5529-027c-4d76-8825-16f2d86e4a42SELRES_2fa84526-7748-4dd0-9a45-989ec80b4b72SELRES_372e7e03-79a1-4051-afee-ab2bea51b4c9 to download the same javascript code in txt format.

function AutoCompleteCountryRecords() 
{ 
 var countrySet = new Array();

// Retrieve all Countries records
 Xrm.WebApi.retrieveMultipleRecords("new_countries", "?$select=new_name,new_countrycode,new_capital").then( 
 function success(result) {
 // Check whether result contains records or not
 if (result.entities.length > 0) {
 // Read all country records one by one
 for (var countryRecordsCount = 0; countryRecordsCount < result.entities.length; countryRecordsCount++) {
 // Push Country Code, Country Name and Country Capital to countrySet Array
 countrySet.push(
 new Array(
 result.entities[countryRecordsCount].new_countrycode,
 result.entities[countryRecordsCount].new_name,
 result.entities[countryRecordsCount].new_capital
 )
 );
 }
 }
 }, 
 function (error) { 
 // Show error message
 Xrm.Utility.alertDialog(error.message, null);
 });

// Key Press Funtion
 var keyPressFcn = function (ext) {
 try {
 // Get country value
 var countryInput = Xrm.Page.getControl("address1_country").getValue();
 resultSet = {
 results: new Array(),
 commands: {
 // Unique Id
 id: "sp_commands",
 //To add the Link at the bottom of the auto complete search result
 label: "Learn more",
 action: function () {
 // Specify what you want to do when the user
 // clicks the "Learn More" link at the bottom
 // of the auto-completion list.
 // For example onclick of Learn More, just opening bing page
 window.open("https://www.bing.com/");
 }
 }
 };
 // Covert the entered text to lowercase
 var countryInputLowerCase = countryInput.toLowerCase();
 // Read countrySet Array records one by one
 for (var countryCount = 0; countryCount < countrySet.length; countryCount++) {  // Compare the entered text to the Country Name in countrySet Array element, if Yes add the country details to resultSet  if (countryInputLowerCase === countrySet[countryCount][1].substring(0, countryInputLowerCase.length).toLowerCase()) {  // Add the element to the resultSet  resultSet.results.push(  {  id: countrySet[countryCount][0],  fields: [countrySet[countryCount][1], countrySet[countryCount][0], countrySet[countryCount][2]] // Country Name, Country Code, Country Capital  });  } // Check resultSet.results >=10 then break
 if (resultSet.results.length >= 10)
 break;
 }
 // Check resultSet.results has records then results in showAutoComplete otherwise hideAutoComplete
 if (resultSet.results.length > 0) {
 ext.getEventSource().showAutoComplete(resultSet);
 } else {
 ext.getEventSource().hideAutoComplete();
 }
 } catch (e) {
 // Log the error in console
 console.log(e);
 }
 };
 // Register addOnKeyPress event on address1_country field
 Xrm.Page.getControl("address1_country").addOnKeyPress(keyPressFcn);
}

Output:

Open any New or Existing Contact record and start typing country name, below recommendations will be shown.

AutoComplete - Output

Hope you have learned a new feature today :):):)

 

Advertisements