populating a lookup field with javascript that has a display template

  • 3
  • Question
  • Updated 5 years ago
  • Answered
I am populating a lookup field via javascript on page load. The field has a display template in Skuid, such that it should show an alternative field's value (from the target/looked-up record), not the record's "Name" field. E.g., instead of showing the autogenerated standard "record number/name" field, it should show a formula field that is more useful for users. Great stuff.

This displays fine for records that have already been created. It also works fine if you manually lookup a record. However, when creating a new record, when I populate that field with the ID of the looked-up record via javascript on page load, it displays only the ID of the looked-up record in my lookup field, not what should display according to the display template.

How do I make my code populate the lookup but also display according to the template?
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb

Posted 5 years ago

  • 3
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,056 Points 20k badge 2x thumb
The trick is that, in addition to populating the lookup field's foreign key reference (e.g. "My_Related_Object__c", "AccountId") you need to populate the lookup field's related object data itself (e.g. "My_Related_Object__r", "Account").

In our example here, we have 2 Models: one, on Account, contains a single Account record that we query for. We want to use this to prepopulate the "AccountId" field on a new Contact record stored in our other Model, called NewContact. We want to have the "AccountId" field prepopulated with the Account's Id, but, as Peter describes, we have a Display Template set on the field so that we'll see the Account's Name AND its Billing Country:








Here is some Inline JavaScript that will accomplish this:

(function(skuid){    
   var $ = skuid.$;
    $(function(){
        var MyAccount = skuid.$M('MyAccount');
        var MyAccountRow = MyAccount.data[0];
        var NewContact = skuid.$M('NewContact');
        var NewContactRow = NewContact.data[0];
        
        NewContact.updateRow(NewContactRow,{
           AccountId: MyAccountRow.Id,
           Account: MyAccountRow
        });
        // We need to go manually tell our Field Editor
        // to re-render its "AccountId" field.
        // Since a Field Editor registers itself as a List
        // on our NewContact Model, we can do this 
        $.each(NewContact.registeredLists,function(){
            $.each(this.renderedItems,function(){
               $.each(this.fields,function(){
                    if(this.id==='AccountId') this.render();
               });
            });
        });
    });
})(skuid);
Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb
Thanks Zach. In my script, I'm already populating the field "enrollment__r" with the target record name, and "enrollment__c" with it's ID. Is that how it should work for a custom relationship field?
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,056 Points 20k badge 2x thumb
The key thing is that you want to populate "Enrollment__r" with the Enrollment record, not just its name, that way Skuid when parsing your custom Display Template will be able to examine the Enrollment record to find all of the fields that you request in your Display Template, not just the Name field.

So if we have:

var EnrollmentModel = skuid.$M('Enrollment');
var EnrollmentRow = EnrollmentModel.data[0];
var NewModel = skuid.$M('NewModel');
var NewRow = NewModel.data[0];
        
Then doing:

NewModel.updateRow(NewRow,{
     Enrollment__c: EnrollmentRow.Id,
     Enrollment__r: EnrollmentRow
});

is NOT the same as doing this:

NewModel.updateRow(NewRow,{
     Enrollment__c: EnrollmentRow.Id,
     Enrollment__r: EnrollmentRow.Name
});

It's a subtle difference, but an important one.

Photo of Peter Bender

Peter Bender, Champion

  • 6,246 Points 5k badge 2x thumb
Ah yes, sorry, that is what I meant - I am using the row/record, as you say, not the name. Are you saying that as long as I do that, and render my field editor afterwards, it should be working with my display template fine? If so I must have a different issue.
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,056 Points 20k badge 2x thumb
Yes that should be working ... must be a different issue.