Help

Upcoming database upgrades. Airtable functionality will be reduced for ~15 minutes at 06:00 UTC on Feb. 4 / 10:00 pm PT on Feb. 3. Learn more here

Can I Filter Tables available to TablePicker?

Topic Labels: Custom Extensions
Solved
Jump to Solution
482 2
cancel
Showing results for 
Search instead for 
Did you mean: 

I have a TablePickerSynced that I’d like to filter the options for. I’ve got the element conditionally disabled based on the presence of a selection in another TablePickerSynced:

<FormField label="Which table holds the Events/Bookings?">
    <TablePickerSynced
        globalConfigKey={GlobalConfigKeys.APPOINTMENTS_TABLE_ID}
        onChange={() => apptCheckTablesAreNotSame()}
        size="large"
        maxWidth="350px"
        disabled={!props.globalConfig.get(GlobalConfigKeys.PEOPLE_TABLE_ID)}
    />
</FormField>

…but I’d also like the Tables available to be picked in this second TablePickerSynced to be filtered to only include those Tables to which the table selected in the first TablePickerSynced (props.globalConfig.get(GlobalConfigKeys.PEOPLE_TABLE_ID)) has a Linked Record relationship.

Is this possible? I don’t see anything in the documentation that would indicate that it is, but I know the FieldPicker can at least disable certain options within the picker dropdown, so it seems like this kind of thing should be feasible.

1 Solution

Accepted Solutions

Hi Jeremy,

This isn’t currently possible with a TablePicker - I’ve filed a task on our end to look at adding this!

You could implement this by manually filtering the tables and using a SelectSynced:

const base = useBase();
const linkedTables = base.tables.filter(table => {
    return yourCondition; // replace with your logic
});
const linkedTableOptions = linkedTables.map(table => {
    return {value: table.id, label: table.name};
});

...

return <SelectSynced
    options={linkedTableOptions}        
    globalConfigKey={GlobalConfigKeys.APPOINTMENTS_TABLE_ID}
/>

See Solution in Thread

2 Replies 2

Hi Jeremy,

This isn’t currently possible with a TablePicker - I’ve filed a task on our end to look at adding this!

You could implement this by manually filtering the tables and using a SelectSynced:

const base = useBase();
const linkedTables = base.tables.filter(table => {
    return yourCondition; // replace with your logic
});
const linkedTableOptions = linkedTables.map(table => {
    return {value: table.id, label: table.name};
});

...

return <SelectSynced
    options={linkedTableOptions}        
    globalConfigKey={GlobalConfigKeys.APPOINTMENTS_TABLE_ID}
/>

Thanks, @Emma_Yeap - I was working on this very thing last night and couldn’t quite get it. This will help.