Skip to content

[Bug]: client-side filters does not contains filter is not work for computed column #41531

@cheer555

Description

@cheer555

Is there an existing issue for this?

  • I have searched the existing issues

Description

Appsmith Table Component Calculated Column Filtering Bug Report

Issue Summary

In Appsmith v1.8.0, the Table component's calculated columns exhibit inconsistent behavior when using the does not contain filter, while the contains filter consistently works correctly.

Environment Information

  • Appsmith Version: v1.8.0
  • Component: Table
  • Issue Type: Data filtering functionality anomaly

Reproduction Steps

Test Data

// TableData data source
[{
  "id": 21319,
  "project_id": 1109,
  "project_name": "Platform Security",
  "is_from_bcp_code": "2603",
  "is_real_delivery": true
}]

Scenario 1: Calculated Column Displaying Converted Value

  1. Set the calculated display value for the is_from_bcp_code column in the Table component:
    {{ currentRow.is_from_bcp_code === '2603' ? 'Manual Entry' : currentRow.is_from_bcp_code }}
  2. The interface displays: "Manual Entry"
  3. Attempt to use does not contain filtering:
    • Filter keyword: "Manual Entry" → Does not work
    • Filter keyword: "2603" → Does not work

Scenario 2: Calculated Column Displaying Combined Value

  1. Modify the calculated display value:
    {{ currentRow.is_from_bcp_code === '2603' ? 'Manual Entry[2603]' : currentRow.is_from_bcp_code }}
  2. The interface displays: "Manual Entry[2603]"
  3. Attempt to use does not contain filtering:
    • Filter keyword: "2603" → Works ✓
    • Filter keyword: "Manual Entry" → Does not work ✗

Scenario 3: contains Filter (Control Group)

Regardless of display value settings:

  • contains "Manual Entry"Always works ✓
  • contains "2603"Always works ✓

Expected Behavior

  1. The does not contain filter should operate based on the displayed value
  2. Filtering behavior should be consistent between contains and does not contain
  3. Filtering with the same keyword should behave consistently regardless of how the display value is calculated

Actual Behavior

  1. does not contain filtering handles calculated column display values inconsistently
  2. The filtering logic appears to be based on the original value in some cases and the displayed value in others
  3. There is an asymmetry between contains and does not contain filtering logic

Impact Scope

  • Table components using calculated columns that require does not contain filtering functionality
  • Data display interfaces relying on precise filtering capabilities

Suggested Temporary Workarounds

Currently available temporary solutions:

  1. Pre-calculate display values at the data source level rather than relying on the Table component's calculated column functionality
  2. Use contains filtering combined with reverse logic instead of does not contain
  3. Consider using JS functions for custom filtering

Additional Information

  • Issue confirmed in Appsmith v1.8.0
  • Similar issues may exist in other versions
  • No error logs in the console
  • Filters are client-side JS filtering and do not involve API requests

Reproduction Environment Requirements

  • Appsmith v1.8.0
  • Table component containing calculated columns
  • Use of does not contain filtering functionality

Tags: bug, table-component, filtering, calculated-columns
Priority: Medium
Component: Table Widget
Related Features: Column Filtering, Calculated Columns, Data Display

Steps To Reproduce

Steps to Reproduce

Prerequisites

  • Appsmith instance version v1.8.0
  • Table widget configured with sample data
  • Access to Table widget properties

Step 1: Configure Basic Setup

  1. Create a new page in your Appsmith application
  2. Drag a Table widget onto the canvas
  3. Configure Table Data with the following JSON:
[{
  "id": 21319,
  "project_id": 1109,
  "project_name": "Henan Zhengzhou Platform Security",
  "is_from_bcp_code": "2603",
  "is_real_delivery": true
}]

Step 2: Configure Calculated Column (Scenario 1)

  1. Select the Table widget
  2. Open the column settings for is_from_bcp_code column
  3. Change column type to "Custom"
  4. Set Computed Value to:
{{ currentRow.is_from_bcp_code === '2603' ? 'Manual Entry' : currentRow.is_from_bcp_code }}
  1. Confirm the column now displays "Manual Entry" instead of "2603"

Step 3: Test Filtering Behavior (Scenario 1)

  1. Enable column filtering for the is_from_bcp_code column
  2. Set filter to "does not contain" with value "Manual Entry"
    • Expected: Row should be filtered out (hidden)
    • Actual: Row remains visible ❌
  3. Change filter value to "2603"
    • Expected: Row should be filtered out (hidden)
    • Actual: Row remains visible ❌

Step 4: Modify Calculated Column (Scenario 2)

  1. Update Computed Value to:
{{ currentRow.is_from_bcp_code === '2603' ? 'Manual Entry[2603]' : currentRow.is_from_bcp_code }}
  1. Confirm the column now displays "Manual Entry[2603]"

Step 5: Test Filtering Behavior (Scenario 2)

  1. Set filter to "does not contain" with value "2603"
    • Expected: Row should be filtered out (hidden)
    • Actual: Row IS filtered out ✓
  2. Change filter value to "Manual Entry"
    • Expected: Row should be filtered out (hidden)
    • Actual: Row remains visible ❌

Step 6: Test "contains" Filter (Scenario 3)

  1. Set filter to "contains" with value "Manual Entry"
    • Result: Row remains visible (filter works correctly) ✓
  2. Change filter value to "2603"
    • Result: Row remains visible (filter works correctly) ✓
  3. Repeat with both display formats from Step 2 and Step 4
    • Observation: "contains" filter works consistently in all cases

Step 7: Additional Verification

  1. Add more rows with different is_from_bcp_code values:
[
  {"id": 21319, "is_from_bcp_code": "2603"},
  {"id": 21320, "is_from_bcp_code": "2604"},
  {"id": 21321, "is_from_bcp_code": "2605"}
]
  1. Test filtering with mixed data
  2. Verify the issue persists across multiple rows

Step 8: Document the Issue

  1. Take screenshots of:
    • Table configuration
    • Filter settings
    • Actual vs expected results
  2. Check browser console for any JavaScript errors
  3. Confirm filtering is client-side (no network requests)

Note: All filtering tests should be performed with the Table's built-in filter feature, not through queries or external filtering mechanisms. The issue is specific to the Table widget's UI filtering functionality when applied to calculated columns.

Public Sample App

No response

Environment

Production

Severity

Medium (Frustrating UX)

Issue video log

No response

Version

Self Host v1.8.0

Metadata

Metadata

Labels

BugSomething isn't workingCommunity Reportedissues reported by community membersMediumIssues that frustrate users due to poor UXNeeds TriagingNeeds attention from maintainers to triageProduction

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions