Tuesday, 20 June 2017

Auto-Complete for Lookup Controls in CRM Portal

Yes, you heard it right and landed on right location.




This is something we wanted since long time in Adxstudio Portal and now in CRM Portal . the term ‘autocomplete’ might be a bit misleading since the field is not automatically completed but instead you can select the suggested item from the list.

Till now, neither in Adxstudio nor in CRM Portal has this feature which sometime leaves a bad impression because some users have commented that the user experience is not as intuitive as they would like.

User would expect to be able to type into the control to look up data, or at least be able to interact with the text element of the look-up control.

As per the Adxstudio Community, they would like to add this feature in future release, though they don't have a timeline for when they might do so.

This article has step by step guide to achieve autocomplete feature on Portal lookup controls :

Here we go...

You do not need to do anything, I have made set everything for you 👍

You just need to do some simple configuration to make it work.

Step 1: Download the JavaScript File from here

Step 2 : Create a Web File record (under Portal > Web Files) with below mentioned details.


Step 3 : Attach JavaScript file in 'Notes' that you have downloaded in Step 1.

















Step 4 : You are all set with the require configuration. Now to apply Lookup Search or Lookup Autocomplete feature you just need to go to Custom JavaScript section of either Webpage or Entity Form.

$(document).ready(function() {

//Parameter1 ------> Lookup Field's Entity Name

//Parameter2 ------> PrimaryField name of Lookup Field's Entity Name 

//Parameter3 ------> OData Feeds Entity Set Name (Entity List that you have been created for OData Feeds)

//Parameter4 ------>  'Field Name' that you want to search in Lookup Field.

//Parameter5 ------>  'Lookup Field Name Id' on which you are enabling Search feature.(<input id="lookupfieldname_name"></input>)

//Parameter6 ------>  'Lookup Field Id' on which you are enabling Search feature. (<input id="lookupfieldname"></input>)

//Parameter7 ------>  'Lookup Field Entity Name Id' on which you are enabling Search feature. (<input id="lookupfieldname_entityname"></input>)

Note : Those who are confused what does Parameter 5,6,7 actually means can look the below snapshot for more information. Every Lookup on Portal comes with three IDs highlighted with yellow.



//Parameter8 ------>  'Guid' of Portal Logged In User.


//Parameter9 ------> 'Field Name' of Lookup Field's Entity in which you are storing Contact Name.

  var loggedinUser = '{{ user.Id }}';

  var loggedinuserAccount = '{{ user.parentcustomerid }}';

   $.getScript('~/content/LookupSearchContol', function () {
   
 // If you don't want to incorporate logged In User security on lookup autocomplete, just pass the last two parameters value as null

ApplyLookupSearch("contact", "contactid", "contacts", "fullname", "looupfield_name", "lookupfield", "lookupfield_entityname",null,null);


// If you want to incorporate logged In User security on lookup autocomplete, just pass the last two parameters value as below  

or

// Lookup Autocomplete items will be Filtered based on Logged In User

ApplyLookupSearch("incident", "incidentid", "cases", "ticketnumber", "looupfield_name", "looupfield", "lookupfield_entityname",loggedinUser,"primarycontactid");


// If you want to incorporate logged In User Account security on lookup autocomplete, just pass the last two parameters value as below  

or

// Lookup Autocomplete items will be Filtered based on Logged In User Account

ApplyLookupSearch("incident", "incidentid", "cases", "ticketnumber", "looupfield_name", "looupfield", "lookupfield_entityname",loggedinuserAccount,"customerid");

   });
   
});


Step 5 : Once you are done with all the above mentioned configuration for 'Lookup Autocomplete' feature, You just need to log Into your Portal and go to that Lookup in which you have enabled searching option.

Type the text and press 'Tab' in the keyboard, you will find list of all related items/records in the list matched to your types text same like CRM.


For Example :

Suppose you have 'State' or 'City' Lookup field on Portal Entity Form and you want to incorporate Lookup Autocomplete then you have to call function as below :

ApplyLookupSearch("stateentityname", "stateentityprimaryfieldname", "states", "name", "looupfield_name", "looupfield", "lookupfield_entityname",null,null);

I kept last two parameters null, because I don't want to apply logged In user security here.

But, suppose if I have 'Case' lookup field on Portal Entity Form and you want to incorporate Lookup Autocomplete then you have to call function as below :

ApplyLookupSearch("incident", "incidentid", "cases", "ticketnumber", "looupfield_name", "looupfield", "lookupfield_entityname",loggedinUser,"primarycontactid");

In this case, it's is mandatory to apply logged In user security on lookup autocomplete, as we would like to show only logged In user Cases instead of all User Cases in autocomplete list.

Same if you want to apply security based on Logged In User Account basis then apply Logged In user Account Id and Account Field name (in last two parameters) in which you are storing Account details.


Please feel free to get in touch and share your inputs with me. Happy CRMing...😊
Blogger Widgets