Present Lookup like Choice

Forms SharePoint Online
1

Hi! Is there any way to have a SharePoint lookup field displayed like a choice field with multiple radio buttons?

I can’t see any setting for this, so I presume this isn’t available as a standard function (presumably because a lookup could have too many options).

Would an alternative be to have a choice field and dynamically load the data from the lookup’s list, then update the (hidden) lookup control from the selected value? That sounds plausible to me, but I’m trying to think how this would work as practice. Has anyone attempted something similar?

2

Hello @MarkUden,

You can add Common Single Choice field and change its options with the code:

fd.field('Lookup').ready(field => {
const options = field.widget.dataSource.data()

fd.field('Choice1').options = options.map(i => i.Title);
});

And save selected option to the Lookup field:

fd.field('Choice1').$on('change', value => {
    fd.field('Lookup').value = options.find(i => i.Title === value).ID
})

Please see the documentation for more information:

3

Hi @Margo,

Thank you very much for that!

I’ve converted it into a reusable function and it works really well.

function lookupPresentAsChoiceSingle(lookupName, choiceName, itemLimit = 20) {

let lookupField = fd.field(lookupName);

let choiceField = fd.control(choiceName);

if (!lookupField || !choiceField) {

    return;

}

lookupField.ready().then(field => {

    var items = lookupField.widget.dataSource.view();

    if (items.length <= itemLimit) {

        // Use choice comtrol to display lookup options.

        lookupField.hidden = true;

        const options = field.widget.dataSource.data();

        choiceField.options = options.map(i => i.Title);

        choiceField.$on('change', value => {

            lookupField.value = options.find(i => i.Title === value).ID

        });

    } else {

        // Too many options to display as choice.

        choiceField.hidden = true;

    }

});

}

I appreciate your help!

1 Like