How can i set up this filter ?

Kairi
Kairi
in Modeling

I want to allow users to input a text field with items separated by commas (e.g., 

X1,X2,X3,X4,X5

) and, after clicking a boolean (e.g., "Select"), have the page filtered to show data only for the specified items. How can I set up this filter?

Tagged:

Answers

  • Rnilsson
    Rnilsson
    edited September 24

    Hi,

    I think we need a bit more information of what X1, X2 is representing.
    If those are list members then I would sugest this solution instead.

    1)
    Have a Boolean added to an ADMIN module (no dim). ("confirm choice/select")

    2)
    Have a module (FIL01) dimensioned by your list
    1 "Filter Line item" (formatted as a boolean) = should have no formula
    2 "Filter Confirmed Picks" = If not "ADM01.select" then true/false (depending on how you want it to operate) else "Filter Line Item"

    Here they can select the items manually (instead of typing).

    Still want to add typing?
    Add SYS Lookup: "Item to find" (formatting text)

    Then you can add another filter to FIL01
    "Find Item" = Name(item(L1)) = sys lookup.'item to find'

    Then add this as a filter to the UX-card.

    This would allow users to search for an item, then check the boolean and search for another item.

    You could add a lot more logic to have a dynamic search function, but this is probably the most you need.

    Does this work for you?

    Best,
    Rickard

  • foram456teen
    foram456teen
    edited September 27

    Hello,

    You try this one type

    To set up a filter that allows users to input a comma-separated list of items and display data based on their selection, you can follow these general steps using HTML, JavaScript, and possibly a backend if needed. Here’s a simple example using just HTML and JavaScript:

    Step 1: HTML Structure
    Create an input field for the user to enter their items and a button to trigger the filter.

    <!DOCTYPE html><html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Item Filter</title>
    <style>
    /* Simple styling */
    .hidden {
    display: none;
    }
    </style>
    </head>
    <body>
    <h1>Item Filter</h1>
    <input type="text" id="itemInput" placeholder="Enter items separated by commas">
    <button id="filterButton">Select</button></body>
    </html>

    Step 2: Explanation
    HTML Elements:

    An input field (#itemInput) for users to enter their items.
    A button (#filterButton) to trigger the filtering action.
    A list (#itemList) of available Ford Benefits items, each represented by a <li> element.
    JavaScript Logic:

    An event listener on the button captures the click event.
    The input string is split by commas, trimmed of whitespace, and stored in an array (filterItems).
    Each item in the list is checked against the filterItems array. If it matches, it remains visible; if not, it gets the hidden class applied to it.

    hope that helps you!

Categories