Attempted to highlight the values of the select component

I'm trying to highlight the color of the select component values. Please take a look below to see the issue I'm facing.

You'll see a Date Range component and a "Select Task Type" component. The "Select Task Type" dropdown contains all task IDs, and when I select a task ID, the table filters based on that selection. The "task_id" column is present in my table, so selecting any task ID filters the table accordingly. However, not all task IDs in the dropdown are present in the data because I've also applied a Date Range filter on the table (from August 27, 2024, to September 26, 2024).

The issue arises because the Date Range filter limits the data, and some task IDs in the dropdown don't exist for that date range. I want to highlight the task ID values in the "Select Task Type" component—green for task IDs that are present in the filtered data and red for those that are not.

Hi @Arshad_Irshad, Welcome back to the Retool community!

You can use JavaScript to check whether the current item is present in the table. Refer to the attached screenshot for details. Since id: 3 is missing from the table data, in the select option component's color property, we check if item.id matches any id in table2.data. If it matches, the color will be set to green; otherwise, it will be red.

1 Like

Thanks, @ZeroCodez for your reply, I’ve figured it out!

1 Like