How To add Autocomplete to a Text Field in Dynamics CRM
Scenario:
It might be requested you: when user types texts to a textbox, System helps to user with suggesting some values from couple entities in Dynamics CRM or maybe fetching records from any other resources.
Solution;
It is very simple, just register your code to the key press event for the object and fill the object with suggested values .
There is supported event for MSCRM engine (it has been so long since i do not call MSCRM :) ) calls : addOnKeyPress - when user presses a key over the object, the event is called for given delegated method
please consider performance and load on the network so;
1- do not fetch data from external resources each time user clicks the key - you can wait for the first 3 or 4 letters from the user
2- never fetch all matching records what user types so far, add "top 20 records" to your fetch method
Implementation:
first of all register the method while loading the form in Dynamics CRM:<Practice>
Create a javascript (.js) for each entity in Dynamics CRM for dedicated client scripting as much as possible.
</Practice>
<Practice>
method standards could be
form_onLoad(executionContext) {
var formContext = executionContext.getFormContext(); //to get the formContext
}
form_onSave(executionContext) {
var formContext = executionContext.getFormContext(); //to get the formContext
}
</Practice>now let's delegate our method to the event
function form_onLoad(executionContext) {
var formContext = executionContext.getFormContext(); //to get the formContext
formContext.getControl("<name of the textbox>").addOnKeyPress(<name of the textbox>_addOnKeyPress);
}
We should create a custom method : <name of the textbox>_addOnKeyPress which takes Execution Context parameter
function <name of the textbox>_addOnKeyPress(executionContext) {
var formContext = executionContext.getFormContext(); //to get the formContext
var input = formContext.getControl("<name of the textbox>").getValue();
var resultSet = null;
if (input != null && input.length > 3) {
try {
// activate AutoComplete (or AutoFill)
resultSet = fetchDataMethodfromOtherSources(param1,param2,....);
}
} catch (exp) {
alert(exp);
}
}
if (resultSet != null && resultSet.results != null && resultSet.results.length > 0) {
executionContext.getEventSource().showAutoComplete(resultSet);
} else {
executionContext.getEventSource().hideAutoComplete();
}
}
enjoy...
Good solution, but as we can see in official documentation on https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/clientapi/reference/controls
ReplyDelete"The following methods for the Standard control are deprecated in this release: addOnKeyPress, fireOnKeyPress, and removeOnKeyPress." How would you apply your logic withot addOnKey event?
Hello,
Deletethanks for the mesage.
You are rgiht, Unfortunately, it is deprecated.
Microsoft addresses similiar functionalitiy to PowerApps Component Framework (PCF) control so please follow my another post regarding exposing HTML events for input element.
http://www.muhammetatalay.com/2020/07/controller-exposing-html-input-element.html
You can apply auto-complete through the control that i develop.
enjoy.