Set field as required based on a filtered lookup response

Forms SharePoint Online
1

Hi,

Im trying to set a field as visible and required when you select a specific option from a filtered lookup (which is looking at another list)

my current code is this..

fd.spRendered(function showHideOther() {
// Hide field initially
fd.field('MatterTypeOther').hidden = true;


// Show fields only if 'MatterType1' is 'Other'
if (fd.field('MatterType1').value === 'Other') {
    fd.field('MatterTypeOther').hidden = false;

}


});

fd.spRendered(() => {
// Run on initial render
showHideOther();


// Re-run when the field value changes
fd.field('MatterType1').$on('change', () => {
    showHideOther();
});


});

fd.spRendered(function() {


function setMTOtherRequired() {
    if (fd.field('MatterType1').value === 'Other') {
        // Set Other required
        fd.field('MatterTypeOther').required = true;

    } else {
        // Set Other as not required
        fd.field('MatterTypeOther').required = false;

    }
}

// Calling setMTOtherRequired when the value changes
fd.field('MatterType1').$on('change',setMTOtherRequired);

// Calling setMTOtherRequired on form loading
setMTOtherRequired();

});

fd.field('mattertype1') might be an fd.control but ive tried both

any help would be appreciated…

many thanks

ben

2

Hello @Ben_Page,

You need only one spRendered function in the code. Also the value of the lookup field is an object and to get the display text of the selected value you need to use the LookupValue key.

I updated the code for you. please test.

fd.spRendered(function() {
    function setMTOtherRequired() {
        if (fd.field('MatterType1').value.LookupValue === 'Other') {
            // Set Other required
            fd.field('MatterTypeOther').required = true;
        } else {
            // Set Other as not required
            fd.field('MatterTypeOther').required = false;
        }
    }
    // Calling setMTOtherRequired when the value changes
    fd.field('MatterType1').ready(field => {
        field.$on('change', setMTOtherRequired);
        // Calling setMTOtherRequired on form loading
        setMTOtherRequired();
    });
});
3

@Margo
Doesnt seem to be working...

is it because the MatterType1 is an fd.control not field....

Ive tried both ways. also added the . missing from ready.

my work around is MatterType1 gets put into another field then base it from that field... seems to work but its adding more fields with same data bit silly

does it matter if its in a step of a wizzard?


fd.spRendered(function () {
    // Hide fields initially
    fd.field('MatterTypeOther').hidden = true;
    fd.field('MatterType').hidden = true;

    // Wait for MatterType1 (lookup) to be ready
    fd.control('MatterType1').ready(function (control) {
        function updateMatterTypeFields(value) {
            // Set MatterType field to the selected lookup value's field_5
            fd.field('MatterType').value = value ? value.field_5 : '';

            // Show/hide and require MatterTypeOther if value is 'Other'
            const isOther = value && value.field_5 === 'Other';
            fd.field('MatterTypeOther').hidden = !isOther;
            fd.field('MatterTypeOther').required = isOther;
        }

        // Initial run
        updateMatterTypeFields(control.value);

        // On change
        control.$on('change', updateMatterTypeFields);
    });
});

this worked

any ideas

4

@Ben_Page,

I’m sorry for the typo. If this is a Lookup control, then you must call the control like so:

fd.control('MatterType1')

Have you specified this field_5 in Extra fields property?

When using this code, are there any errors in the browser console? Please share the screenshot.

fd.spRendered(function() {
    // Hide fields initially
    fd.field('MatterTypeOther').hidden = true;
    fd.field('MatterType').hidden = true;

    function updateMatterTypeFields(value) {
        // Show/hide and require MatterTypeOther if value is 'Other'
        const isOther = value && value.field_5 === 'Other';
        fd.field('MatterTypeOther').hidden = !isOther;
        fd.field('MatterTypeOther').required = isOther;
    }
    // Wait for MatterType1 (lookup) to be ready
    fd.control('MatterType1').ready(function(control) {
        // Initial run
        updateMatterTypeFields(control.value);
        // On change
        control.$on('change', value => {
            updateMatterTypeFields(value);
        });
    });
});