🔗
Demo to preview the settings
Introduction
Calculate and manage list data directly within your Bubble app. Real-time list sum, difference, and cumulative calculations for seamless data processing. Lists Plugin enhances user experience by enabling dynamic and structured list computations within your application.
Use the Lists element to generate and compute list data effortlessly. The plugin actions and states return essential information such as the current list calculations, allowing for real-time updates and changes.
The plugin also provides states that reflect the current list calculations and content, ensuring users can always manage and utilize structured data efficiently. Implement workflows based on list data conditions, improving app functionality and user engagement by responding to data-driven events.
Plugin Actions
Arithmetic [list & list] - Perform operations between 2 lists.
Fields:
Title | Description | Type |
List of numbers 1 | The initial list for arithmetic operations. | list of numbers |
List of numbers 2 | The secondary list for arithmetic operations. | list of numbers |
Operation | This dropdown defines all allowed operations. Available operatations: addition, subtraction, multiplication, division, exponentiation, quotient of division, remainder of division, minimum, maximum, average. | Dropdown |
Replace "empty" values with 0 or 1 | Enables replacing the 'empty' values with neutral values [0 (zero) or 1 (one)]. For example, 'addition' will replace the 'empty' values with 0, and 'multiplication' - 1.
Check here how this field may affect the result. | Checkbox |
Returned values:
☝️
Bubble doesn't allow returning a list that may contain empty values. That's why the 'result' state is returned as concatenated values separated by a comma (,). This needs to be converted from text into a list of numbers. To do this, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" when using the state.
👉
The list length that results from the calculations will always be the same as the length of the “List of numbers 1”!
Title | Description | Type |
result | The "result" state is returned as the concatenated values separated by a comma (,). This needs to be converted from text to a list of numbers. So, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" while using the state.
Check here how to use this state. | text |
Arithmetic [list & number] - Perform operations between a list and a number.
Fields:
Title | Description | Type |
List of numbers | The list for arithmetic operations. | list of numbers |
Number | The number (constant) for arithmetic operations. | number |
Operation | This dropdown defines all allowed operations.
Available operatations: addition, subtraction, multiplication, division, exponentiation, quotient of division, remainder of division, minimum, maximum, average. | Dropdown |
Replace "empty" values with 0 or 1 | Enables replacing the 'empty' values with neutral values [0 (zero) or 1 (one)]. For example, 'addition' will replace the 'empty' values with 0, and 'multiplication' - 1.
Check here how this field may affect the result. | Checkbox |
Returned values:
☝️
Bubble doesn't allow returning a list that may contain empty values. That's why the 'result' state is returned as concatenated values separated by a comma (,). This needs to be converted from text into a list of numbers. To do this, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" when using the state.
👉
The list length that results from the calculations will always be the same as the length of the “List of numbers”!
Title | Description | Type |
result | The "result" state is returned as the concatenated values separated by a comma (,). This needs to be converted from text to a list of numbers. So, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" while using the state.
Check here how to use this state. | text |
Cumulative - Perform the cumulative operations on the single list.
Fields:
Title | Description | Type |
List of numbers | The list for cumulative operations. | list of numbers |
Operation | Dropdown | |
Replace "empty" values with 0 or 1 | Enables replacing the 'empty' values with neutral values [0 (zero) or 1 (one)]. For example, 'sum' will replace the 'empty' values with 0, and 'product' - 1.
Check here how this field may affect the result. | Checkbox |
Returned values:
☝️
Bubble doesn't allow returning a list that may contain empty values. That's why the 'result' state is returned as concatenated values separated by a comma (,). This needs to be converted from text into a list of numbers. To do this, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" when using the state.
👉
The length of the list resulting from the calculations will always be the same as the length of the 'List of numbers', except for the 'frequency' operation. This operation may return fewer elements than the initial list.
Title | Description | Type |
result | The "result" state is returned as the concatenated values separated by a comma (,). This needs to be converted from text to a list of numbers. So, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" while using the state.
Check here how to use this state. | text |
Consecutive - Perform the consecutive operations on the single list.
Fields:
Title | Description | Type |
List of numbers | The list for consecutive operations. | list of numbers |
Operation | This dropdown defines all allowed operations.
Available operatations: addition, subtraction, multiplication, division, exponentiation, quotient of division, remainder of division, minimum, maximum, average. | Dropdown |
Replace "empty" values with 0 or 1 | Enables replacing the 'empty' values with neutral values [0 (zero) or 1 (one)]. For example, 'addition' will replace the 'empty' values with 0, and 'multiplication' - 1.
Check here how this field may affect the result. | Checkbox |
Returned values:
☝️
Bubble doesn't allow returning a list that may contain empty values. That's why the 'result' state is returned as concatenated values separated by a comma (,). This needs to be converted from text into a list of numbers. To do this, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" when using the state.
👉
The list length that results from the calculations will always be the same as the length of the “List of numbers”!
Title | Description | Type |
result | The "result" state is returned as the concatenated values separated by a comma (,). This needs to be converted from text to a list of numbers. So, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" while using the state.
Check here how to use this state. | text |
Arithmetic [lists] - Perform operations between 2+ lists.
Fields:
Title | Description | Type |
Concatenated Lists | A list of lists encoded as text, where each item in a list is separated by a specific character, and each list is separated by another specific character. For example: 2,7,4,1&3,4&1,4,2. | text |
List Item Separator | A specific character used in the 'Concatenated Lists' to separate list items. | text |
List Separator | A specific character used in the "Concatenated Lists" to separate lists. | text |
Operation | This dropdown defines all allowed operations.
Available operatations: addition, subtraction, multiplication. | Dropdown |
Replace "empty" values with 0 or 1 | Enables replacing the 'empty' values with neutral values [0 (zero) or 1 (one)]. For example, 'addition' will replace the 'empty' values with 0, and 'multiplication' - 1.
Check here how this field may affect the result. | Checkbox |
Returned values:
☝️
Bubble doesn't allow returning a list that may contain empty values. That's why the 'result' state is returned as concatenated values separated by a comma (,). This needs to be converted from text into a list of numbers. To do this, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" when using the state.
👉
The list length that results from the calculations will always be the same as the length of the biggest provided list from "Concatenated Lists"!
Title | Description | Type |
result | The "result" state is returned as the concatenated values separated by a comma (,). This needs to be converted from text to a list of numbers. So, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" while using the state.
Check here how to use this state. | text |
Helpful details
Operations
Addition (+)
List & list - The 'addition' or 'sum' of elements from two lists involves summing each item from the first list with the corresponding item from the second list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'addition' or 'sum' of elements from a list with a number involves summing each item from the list with a constant.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'addition' or 'sum' of consecutive elements from a list involves summing each item from the list with the previous item from the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
More lists - The 'addition' or 'sum' of elements from multiple lists involves summing each item from a list with the corresponding items from the other lists.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Subtraction (-)
List & list - The 'subtraction' or 'difference' of elements from two lists involves subtracting each item from the second list from the corresponding item in the first list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'subtraction' or 'difference' of elements from a list with a number involves subtracting a constant from each item in the list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'subtraction' or 'difference' of consecutive elements from a list involves subtracting each item in the list from the previous item in the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
More lists - The 'subtraction' or 'difference' of elements from multiple lists involves subtracting the items from the other lists from the corresponding items in the first list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Multiplication (*)
List & list - The 'multiplication' or 'product' of elements from two lists involves multiplying each item in the first list by the corresponding item in the second list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'multiplication' or 'product' of elements from a list by a number involves multiplying each item in the list by a constant.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'multiplication' or 'product' of consecutive elements from a list involves multiplying each item in the list by the previous item from the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
More lists - The 'multiplication' or 'product' of elements from multiple lists involves multiplying each item in a list by the corresponding items from the other lists.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Division (/)
List & list - The 'division' of elements from two lists involves dividing each item in the first list by the corresponding item in the second list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'division' of elements from a list by a number involves dividing each item in the list by the constant.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'division' of consecutive elements from a list involves dividing each item in the list by the preceding item from the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Exponentiation (^)
List & list - The 'exponentiation' of elements from two lists involves raising each item in the first list to the power of the corresponding item in the second list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'exponentiation' of elements from a list by a number involves raising each item in the list to the power of the constant.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'exponentiation' of consecutive elements from a list involves raising each item in the list to the power of the preceding item from the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Quotient of division ()
List & list - The 'quotient of division' of elements from two lists involves dividing each item in the first list by the corresponding item in the second list and returning the integer part of the result.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'quotient of division' of elements from a list by a number involves dividing each item in the list by the constant and returning the integer part of the result.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'quotient of division' of consecutive elements from a list involves dividing each item in the list by the preceding item from the same list and returning the integer part of the result.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Remainder of division (mod)
List & list - The 'remainder of division' of elements from two lists involves dividing each item in the first list by the corresponding item in the second list and returning the remainder.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'remainder of division' of elements from a list by a number involves dividing each item in the list by the constant and returning the remainder.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'remainder of division' of consecutive elements from a list involves dividing each item in the list by the preceding item from the same list and returning the remainder.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Minimum ()
List & list - The 'minimum' of elements from two lists involves finding the minimum between each item in the first list and the corresponding item in the second list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'minimum' of elements from a list and a number involves finding the minimum between each item in the list and the constant.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'minimum' of consecutive elements from a list involves finding the minimum between each item in the list and the preceding item from the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Maximum ()
List & list - The 'maximum' of elements from two lists involves finding the maximum between each item in the first list and the corresponding item in the second list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'maximum' of elements from a list and a number involves finding the maximum between each item in the list and the constant.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'maximum' of consecutive elements from a list involves finding the maximum between each item in the list and the preceding item from the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Average ()
List & list - The 'average' of elements from two lists involves calculating the average of each item in the first list and the corresponding item in the second list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
List & number - The 'average' of elements from a list and a number involves calculating the average of each item in the list and the constant.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Consecutive - The 'average' of consecutive elements from a list involves calculating the average of each item in the list and the preceding item from the same list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Cumulative
Sum - The cumulative 'sum' of elements from a list involves adding each item in the list to the sum of all the previous items in the list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Product - The cumulative 'product' of elements from a list involves multiplying each item in the list by the product of all the previous items in the list.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Frequency - The cumulative 'frequency' of elements from a list involves sorting the list, finding the frequency of each item, and adding each item's frequency to the sum of all previous item frequencies. Check here more detailed steps.
☝️
Mathematically, this operation can be described by the following formula:
Example:
Replacement “empty” values rules
Below is a presentation of how the 'empty' value will be replaced, depending on the selected operation.
Operation | Replacement value |
Addition (Sum) | 0 |
Subtraction | 0 |
Multiplication (Product) | 1 |
Exponentiation | 1 |
Division | 1 |
Quotient of division | 1 |
Remainder of division | 1 |
Minimum | 0 |
Maximum | 0 |
Average | 0 |
Frequency | 0 |
Workflow example
How to use Arithmetic [lists] action
Compared to the 'Arithmetic [list & list]' action, which receives lists of numbers, the 'Arithmetic [lists]' action accepts multiple lists in the 'Concatenated Lists' field, but these lists must be converted to text.
- Here is a Group element that contains the used list items for calculation.
- Inside, there is a Text element that will display all the used lists.
The database contains the following values…
- The result of the calculation is stored in a custom state of the Group element and is displayed in another Text element.
- When the “Calculate Sum” button is clicked, the “Arithmetic [lists]” action is triggered with the following settings.
- All lists from 'Concatenated Lists' are converted to text using the 'join with' action.
- For the 'join with' action, a comma (
,
) is used to separate each item in the list. - A comma is also used in the 'List Item Separator' field to indicate that each item in the list is separated by a comma.
- Each list is separated by an ampersand (
&
). - An ampersand is also used in the 'List Separator' field to indicate that each list is separated by an ampersand.
- The 'Replace "empty" values with 0 or 1' field is enabled. This means that 'empty' values from the lists will be replaced with '0'. Check the replacement rules here.
- The lists’ length are different
- The 1st list has 2 elements.
- The 2nd list has 3 elements.
- The 3rd list has 4 elements.
- Thus, the length of the result will be 4. Check this note.
☝️
Ensure the following:
- In the preview, all lists will be concatenated, and the result will be displayed correctly.
How the ‘Replace “empty” values …’ option may affect the result
Sometimes the data stored in the database may contain 'empty' values. Theoretically, if 'empty' means 'nothing', then calculations with 'nothing' should return 'nothing'. The 'Replace “empty” values …' field indicates how the action should handle this.
- Here is a Group element that contains the used list items for calculation.
- Inside, there is a Text element that will display all the used lists.
The database contains the following values…
- The result of the calculation is stored in a custom state of the Group element and is displayed in another Text element.
- When the “Subtract” button is clicked, the “Arithmetic [list & list]” action is triggered with the following settings. The ‘Replace “empty” values …’ field is disabled!
- In the preview, the result will contain 'empty' values because the initial lists contain 'empty' values.
☝️
In a calculation with the 'Replace “empty” values ...' field disabled, if at least one of the two values is 'empty', then the result will be an 'empty' value.
- When the “Subtract” button is clicked, the “Arithmetic [list & list]” action is triggered with the following settings. The ‘Replace “empty” values …’ field is enabled!
- In the preview, the result will not contain 'empty' values because all 'empty' values are replaced before the calculation. Check the replacement rules here.
- Compare the both results.
How to use the ‘result’ state
The obtained result may be used in other elements on the page.
☝️
Bubble doesn't allow returning a list that may contain empty values. That's why the 'result' state is returned as concatenated values separated by a comma (,). This needs to be converted from text into a list of numbers. To do this, use the "result" state with the following Bubble expression: ":split by (,):each item:converted to a number" when using the state.
Changelogs
Update 18.09.24 - Version 1.0.0
- Initial plugin release.