Populate field based on lookup

I'm trying the basic function of showing a field once a value is picked from a lookup field of another list is chosen

But I can't get past the basic function of the Extra Fields/Expand Fields.

when I value these with the internal field name I want to show, the drop down of the look up field no longer works.

I realize i need to add the java code to make this populate this additional field, but I can't get past the simple function of valuing these Extra Fields/Expand Fields without screwing up the function of the lookup field.

Any ideas?

thanks

Hello @eweiler,

What types of columns you need to retrieve from the source list?

Also, please shar the code you're using and a screenshot of the Lookup's Extra and Extended properties setup.

the type of column being retrieved is a date field

Look up of SOW should pull start date of SOW

Hello @eweiler,

Values of the additional columns will be displays only after the data is saved.

If you want to show this values instantly when user selects an option in a lookup dropdown, you can use JavaScript and Extra fields property

Here is the code example:

fd.spRendered(function(){
  fd.field('LookupField').$on('change', function(value){
    //populate Text field with the Extra field value
    fd.field('Text').value = value.ColumnName;
  });
});

Yes, this is my understanding as well, but when i do this, the drop down does not work at all.

This is what it should do...

When I put in the extra field in extra/expanded fields, the drop down stops working...

this is the code i put in...

fd.spRendered(function(){
fd.field('SOW').$on('change', function(value){
//populate Text field with the Extra field value
fd.field('SOW_x003a_Start_x0020_Date').value = value.ColumnName;
});
});

@eweiler,

Please share the screenshot of the errors you get in the browser console when the drop down doesn't work.

And here you must replace ColumnName with the internal name of the column from the source list:

fd.field('SOW_x003a_Start_x0020_Date').value = value.ColumnName;

here's the browser errors... it's saying the field does not exist

this is the field i'm referencing:

here is the new code:

fd.spRendered(function(){
fd.field('SOW').$on('change', function(value){
//populate Text field with the Extra field value
fd.field('SOW_x003a_Start_x0020_Date').value = value.SOW_x003a_Start_x0020_Date;
});
});

@eweiler,

Since this is a Date column type, you don't need to specify its name in the Expand property.

Also, this is an invalid internal name; you need the internal name from the source list. Go to the source list from which the Lookup column retrieves data and check the column's internal name. Use it in the Extra fields property and in the code.

thanks, that got rid of the error, but it's still not displaying the data from the source.
here is the current code:

fd.spRendered(function(){
fd.field('SOW').$on('change', function(value){
//populate Text field with the Extra field value
fd.field('SOW_x003a_Start_x0020_Date').value = value.field_10;
});
});

SOW is the field name of the lookup
field_10 is the internal name from the source and in the Extra fields
SOW_x003a_Start_x0020_Date the field name of the data on the form

@eweiler,

SOW_x003a_Start_x0020_Date - is the default SharePoint Lookup Extra field, you can't change its value.

If you need to only display data on the form,you can use the Common Date field instead:


And disable it with the code:

fd.field('Field1').disabled = true;

sorry, i still can't get it to display the date or disable it from being changed.
Here's the current code

SOWStartdatelocal is the common date field
SOW is the lookup
field_10 is the source field

fd.spRendered(function() {
fd.field('SOW').$on('change', function(value){
//populate Text field with the Extra field value
fd.field('SOWStartDatelocal').value = value.field_10;
fd.field('SOWStartDatelocal').disabled = true;
});
});

@eweiler,

Please update the code like so:

fd.spRendered(function() {
    fd.field('SOWStartDatelocal').disabled = true;
    fd.field('SOW').$on('change', function(value) {
        //populate Text field with the Extra field value
        fd.field('SOWStartDatelocal').value = value.field_10;
    });
});

If it still doesn't work, please share a screenshot of any errors in the browser console (F12) when you change the Lookup field value, and also an export of the form.

sill not working...here's the f12 screen

export of form
Item (New).json (9.6 KB)

@eweiler,

Thank you!

The code is currently commented out, so it's not being executed. Please uncomment it so it looks like this:

Oh, Man, how stupid on my part

thank you, it's working now

1 Like