The List from Data Source is a powerful prefab component in Fliplet Studio that will help you easily display, sort, and filter items. This article will focus on the filtering options available for the LFD component.

Features

Using filters allows you to filter your data to show a custom set of entries from your data source in your LFD.

How to use LFD filters

When setting your filters you need to set a:

  1. Data field
  2. Logic
  3. Value type
  4. Value

To understand more about how to use and apply these filters see below.

  1. Data Field
    The data field should be the field from the connected data source you want to filter. It’s where you are storing the values that will be the filter.

  2. Logic
    The logic field provides a list of logics to choose from. This decides how you will filter the list. The logic options are as follows:

    Logic Data source value Value Sample scenario

    Is empty
    Returns results where the selected data field is empty 

      N/A Shows entries where no data is entered

    Is not empty
    Returns results where the selected data field is not empty

    “London” N/A Shows entries where there is data entered
    Equals
    Returns results where the value matches the selected data field exactly, note that this is case sensitive
    “London” “London” Shows any employees where their office location is either “London”

    Doesn’t equal
    Returns results where the value does not match the selected data field exactly

    “London” “Paris” Shows any employees where their office location is not “Paris”

    Is one of
    Returns results where the data field is one of the values

    “London”

    “London”, “Paris”

    Show any employees where their office location is either “London” or “Paris”

    Text Contains
    Returns results that include the value anywhere in the text

    “Project Management”, “Security”

    “Project Management”

    Show any employees where their list of expertise contains “Project Management”

    The text doesn’t contain
    Returns results that do not include the value anywhere in the text

    “Security” “Project Management” Show any employees where their list of expertise does not contain “Project Management”

    Text matches regex
    Returns a
    value that matches the entered regular expression

    “London, Paris, Tokyo” /Paris/ Shows entries that match the regex

    Is greater than
    Returns results where the number in the data field is greater than the value

    “5” “4” Shows any entries where the data source value is greater than 4

    Is greater or equal to
    Returns results where the number in the data field is greater than or equal to the value 

    “5” “5” Shows any entries where the data source value is 5 or greater

    Is less than
    Returns results where the number in the data field is less than the value

    “5” “6” Show any entries where the data source value is less than 6

    Is less or equal to
    Returns results where the number in the data field is less than or equal to the value

    “5” “5” Shows any entries where the data source value is 5 or less

    Is between
    Returns results where the number in the data field is between the values, including the numbers of the values

    “5” “5” and “7” Shows any entries where the data source value is 5, 6, or 7

    Date is

    Returns results where the date in the data field matches the date in the date field exactly

    “2021-03-31” “Current date (Today)” On 2021-03-31, shows any entries where the data source value is 2021-03-31

    Date is before

    Returns results where the date in the data field is before the date in the date field

    “2021-03-30” “Current date (Today)” On 2021-03-31, shows any entries where the date in the data source value is before 2021-03-31

    Date is after
    Returns results where the date in the data field is after the date in the date field

    “2021-04-01” “Current date (Today)” On 2021-03-31, shows any entries where the date in the data source value is after 2021-03-31

    Date is between
    returns results where the date in the data field is between the dates, including the from and to dates

    “2021-03-31”

    From date “Today – 3 days”

    To date “Current date (Today)”

    On 2021-03-31, shows any entries where the date is between 2021-03-28 and 2021-03-31
  3. Value type and value
    The value type has 4 different options:

    1. Enter a value
      The enter a value option will allow you to enter a specific value from your selected data field for the list to filter. For example, if you would like to display only the entries with the last name Smith, you should select the filters as below:
    2. User profile data
      Using the user profile data value type allows you to set a filter using the logged in users’ profile data.
      For example, if you have a directory of employees, and want each employee to be shown only those in the same office you should set the filters as below.
      For this to work, the value needs to be found in both the LFD data source and the user information data source.

    3. Query
      You can use custom query parameters to pass information from one page to another. You can use this to apply a filter on the page with the LFD.
      For example, if we want to pass location as the query to a screen with an LFD we have to:

      1. Set up a query parameter saying that the location is London. This can be done for example in a list as shown below. When anyone clicks on this menu item it will go to the screen called directory with the location set to London.
      2. On the directory page, you then set the filter of the LFD to use the Link query parameter value type. 
      3. We then set the value to the query parameter we had on the previous page. For example, we use “location” below. This will filter the LFD to show only entries where the location is set to London:

    4. App storage
      App storage can be set using JS code. You would use this for example if you need to save a value in the device storage. This feature requires the storage to be set in code before it can be used in the LFD. Documentation: https://developers.fliplet.com/API/core/storage.html#storage
      For example: 

      1. We can set this to be saved in app storage on any other page. Usually used with a button click.
        Fliplet.App.Storage.set(‘location’, ‘london’);
      2. On the LFD page, we can set the App storage data to get the key for location. This will filter the LFD to show the entries where the Location is London.

Once you have set your filter requirements, remember to save and close.

 

Was this article helpful?
YesNo