Lookup Populate with Javascript

Question

Greetings and thanks in Advance!

Have a visualforce page that allows a user to create a related lookup object.

   <apex:inputField id="newCompetitorAccount" value="{!newCompetitor.Competitor_Account_Name__c}"  />
   <apex:inputText id="newCompetitorProximitiy" value="{!newCompetitor.Proximity__c}" />
   <apex:commandButton reRender="newPanel, existingCompetitorPanel, pageMessages" value="Add" action="{!AddNewCompetitor}" status="updateStatus" id="NewSubmittalCompetitor" />

Note: the inputField newCompetitor.Competitor_Account_Name__c is a lookup to Account Object.

Want to populate this lookup based on another data source which only contains Names ( no account Ids).

Using the UI.. If a user types a MATCHING account name into the lookup box Salesforce magically associates this with correct Account. If the Account Name does not match then you get "Error: No Matches Found". If multiple Accounts are found you have the option to choose which Account.

My issues is I am trying to get this same behavior using Javascript to avoid having the user retyping the Account Name in the inputfield.

 <a href="" onclick="setInputAccount('{!resultWrapper.result.name}', '{!resultWrapper.proximity}');" >Select</a>

 function setInputAccount( accountName , proximity)
    {   
        //alert(accountName);
        $("input[name*='newCompetitorAccount']" ).val(accountName);
        $("input[name*='newCompetitorProximitiy']" ).val(proximity);
        $("input[name*='newCompetitorAccount']" ).onchange();
        $("input[name*='NewSubmittalCompetitor']").click();
    }

The issue is when javascript populates the inputfield and clicks the button you do not get the same behavior as a user would in the UI.

Instead you get this message "Error: value '{!newCompetitor.Competitor_Account_Name__c}' is not a valid id field"

Understand that the lookup wants the Account ID to be populated but do not understand why typing the name and clicking Add results in different behavior then doing this with Javascript. Would be perfectly fine with getting the standard error messaging but the error message displayed is cryptic to the users. This also doesn't display matching accounts if duplicates exists.

Have to be missing some event but cannot figure out what.

Any help!! Thank you!!

Answer 1

The problem is because you're using the "contains" wildcard selector on the name. It is matching many more elements in the page than you think it is and you're setting the value of every one of these inputs to the string.

One of the hidden elements that it is matching is suffixed with _lkid and you're setting the value of this to the name. This input is validated and can only contain an ID.

The matching input element list with that wildcard selector will likely contain:

• newCompetitorAccount_lkid
• newCompetitorAccount_lkold
• newCompetitorAccount_lktp
• newCompetitorAccount_lspf
• newCompetitorAccount_lspfsub
• newCompetitorAccount_mod
• newCompetitorAccount

You need to be more specific with your selector so that it doesn't match so many elements in the page. I would suggest using the id attribute to target this one individual element, since that's its purpose.

However, if you want to keep it as written, change the selector from name*= to name$= ("ends with" rather than "contains")

Answer 2

If you use your browser's "Inspect Element" feature on an edit page where there is a lookup field, you will notice that in addition to the field that contains the related object name, there is a corresponding hidden input field of the same name but with the suffix "_lkid" added. When the lookup dialog is used and a related object is selected, both the name and the ID value are recorded, and when the form is submitted the ID is the important value.

If you are willing to rely on this pattern (that is not documented API and so may change but hasn't for some time), you may be able to get your JavaScript to work by also populating the "_lkid" suffixed ID field with the object ID.