Skip to main content

Autocomplete Lookups for Salesforce1

We all are seeing that Salesforce1 is evolving with every passing day and there is yet lot to be done. One of the many items is a custom lookup field on a Visualforce page.

Lightning design systems do provide us with the CSS we can use to create lookup fields the logic has to be written by the developer. Below is a basic example that can be used to implement the basic autocomplete version of the lookup field.





The auto complete text box is implemented using the CSS provided by Salesforce1 lightning design.

The Visualforce page uses Visualforce remoting to fetch records based on the user input. A call to the controller method is made every time a keyup event is fired and the results are updated.





Comments

  1. Great post, thanks! Could you please tell me how to access the contact ID of the selected element? j$('#lookup').val() returns the name of the selected contact but i would like to know the ID. Thanks again.

    ReplyDelete
  2. Thanks Dev. Id is saved as one of the attributes hence you can retrieve using that attribute value.
    Try
    var id = $('#lookup').attr('aria-activedescendant');

    ReplyDelete
    Replies
    1. '<a id="' + this.id in your code doens´t work, so record id is not saved on the <a> element. Also changing your debug "console.log(this);" in "console.log(this.id);" i see that this.id is not the record id but undefined I tested in google Chrome.Any solution? Thank you.

      Delete
    2. Here is the fixed and working code which alerts the Contact name and Id when you select a contact name: https://github.com/gulshanmiddha/mobile_autocomplete

      Delete
  3. Gulshan, thanks a lot for that awesome post!
    (although it will be cool to remove the search words div if the input is blank, and also not doing a search on less than 2 letters.. But really great post so 10Q!!)

    ReplyDelete
  4. can you please provide jquery_all static resource

    ReplyDelete
  5. This comment has been removed by the author.

    ReplyDelete
  6. The Venetian Hotel Las Vegas - JSHub
    The Venetian Las 남양주 출장안마 Vegas hotel 제천 출장안마 features an outdoor 전라남도 출장안마 pool and 대구광역 출장샵 spa, plus an indoor pool. Guests will be able to 청주 출장안마 enjoy various amenities such as complimentary WiFi

    ReplyDelete

Post a Comment

Popular posts from this blog

Salesforce CPQ - Automatically add a Product to a Quote

Recently I have seen a question popping up on communities that how can we add a product dynamically to a quote (not within the bundle), based on a condition. I'll explain a few simple use cases below. These use cases refer to adding a product on a Quote Line Editor and the CPQ version installed is 214.6 Add a "Warranty" Product if "Macbook Pro" is added to the Quote. While I select "Macbook Pro" to add in my Quote, it should also add the "Warranty" product automatically to my Quote. 1. Product Rule : Create a Product Rule of type Selection and scope equals Quote.  Type: Selection Active: checked Conditions Met: All Scope: Quote Evaluation Event: Always 2. Error Condition : Add an error condition to the Product Rule. This product rule will run if this error condition returns true. As per the use case, it should run if there is a product added to the Quote with a Product code as "MBPRO" Tested Obje

DumpIT - Migrate / Clone Salesforce Org - Data

How complicated can it be to clone data from one Salesforce Org to another? It can take from minutes to weeks depending on the number of objects and relationships between them. I am glad to share a tool I developed which may save you a lot of time. DumpIT comes as an executable jar file which helps to clone data from one Salesforce Org to another. Recently Salesforce released a feature to clone a Sandbox but it has its own limitations and cannot always be used. How to use DumpIT? Prerequisite - You must have Java installed and setup on your local machine. Try running "Java -v" command on your command prompt to make sure its all setup and working.  Step 1: Download the tool Download the tool from this link https://crossdoor.io/dumpit/ Create a folder on your local machine and place all the three downloaded items in that folder. You will see these three items: results folder: Success and Error files are placed on this folder on execution, for each object. You can