A filter object represents an individual filter. It can be fetched using the getFilter function in the Filters API.
It has a number of properties, listeners and functions that allow developers to create code that manipulates the filter and reacts to events that happen on the filter itself.
If the filter option “Value Entry Method” is set to “Value List Selection”, as shown below.
In this case, Yellowfin will attempt to generate possible values for the filter. These values can be retrieved from Reference Code Values, Cached Values or a Custom Query.
The front-end filter options will be passed an Array of JavaScript objects that looks like this:
[{ |
The “value” property is the value that will be applied to any queries that are run using this filter. Using SQL as an example, if I was to select the first value in the above list, an SQL query like this could be generated:
SELECT Country FROM CountryTable where Country = 'AU' |
The “description” property is the value that will be displayed to a user. It will not be used as part of any filter queries. It is possible for the value and description to be the same.
String - The name of the filter.
Returns the display name of the filter, this is the name that will appear when the filter is rendered in the Yellowfin UI.
Yes.
String - Uppercase operator of the filter. This is the operator used by Yellowfin to determine what SQL operator to use when building a query.
Yes.
Shows the operator of the filter Demographic, in this case INLIST :
let filter = filter.get('Demographic'); |
String - Translated and human readable version of the filters operator.
Yes.
let filter = filter.get('Demographic'); |
This is intended as a helper property to get a human readable version of the operator, if you are writing any logic that depends on the operator, use filter.operator instead.
String - UUID of the filter.
Yes .
Array [Object]
An array of the possible value objects that the filter renderer uses to show values for a user to select.
[{ |
This property will only return values in cases where the filter property “Value Entry Method” is set to “Value List Selection” when creating the filter. If this is set to anything other than “Value List Selection” this property will return null.
Use the possibleValues parameter to select all the values for a filter.
let possibleValues = filter.possibleValues; //Get the possible values out of the filter |
Boolean.
Returns true if the filter has a “Between style” operator, this can be “Between” or “Not Between”. This can be used if you want to determine whether there should be multiple input elements if you are writing a custom input element. This should not be used as a replacement for checking if the operator of the filter is BETWEEN.
Yes.
Boolean.
Returns true if the filter has a list operator. The list operators are “In List” and “Not In List”. In List and Not In List share a lot of functionality so this can be useful if you need to determine that functionality should be enabled.
Yes.
Object.
Returns an object with the currently staged values in an Object which can contain the following properties:
What is contained in this object will depend on the operator of the filter. It will only return values that are relevant to that type of filter.
A list filter should only contain “valueList”.
A single entry filter should only contain “valueOne”.
A between filter should contain “valueOne” and “valueTwo”.
Yes.
'In List' example:
let filter = filters.getFilter('Demographic'); |
'Between' example:
let filter = filters.getFilter('Age at Camp'); |
'Single Entry' example:
let filter = filters.getFilter('Age at Camp'); |
String or Number.
Returns the currently staged valueOne on the filter. If the filter is a list filter this will return null.
True.
let filter = filters.getFilter('Average Age at Camp'); |
String or Number.
Returns the currently staged valueTwo on the filter. If the filter is a list filter or a single entry filter this will return null.
True.
let filter = filters.getFilter('Average Age at Camp'); |
Array{String/Number}
Returns the currently staged valueList values on the filter. For 'Single Entry' and 'Between' filters this will return null.
True.
let filter = filters.getFilter('Demographic'); |
Object.
Returns the currently applied filter values in an Object which can contain the following properties:
What is contained in this object will depend on the operator of the filter. It will only return values that are relevant to that type of filter.
A list filter should only contain “valueList”.
A single entry filter should only contain “valueOne”.
A between filter should contain “valueOne” and “valueTwo”.
Yes.
In List example:
let filter = filters.getFilter('Demographic'); |
Between example:
let filter = filters.getFilter('Age at Camp'); |
Single Entry example:
let filter = filters.getFilter('Age at Camp'); |
String or Number.
Returns the filters currently applied valueOne. If the filter is a list filter, this will return null.
True.
let filter = filters.getFilter('Average Age at Camp'); |
String or Number.
Returns the filters currently applied valueTwo. If the filter is not a between filter, this will return null.
True.
let filter = filters.getFilter('Average Age at Camp'); |
Array{String/Number}
Returns the filters currently applied valueList. For Single Entry and Between filters this will return null.
True.
let filter = filters.getFilter('Demographic'); filter.applyFilter(); |
Object.
Returns the filters default values in an Object which can contain the following properties:
What is contained in this object will depend on the operator of the filter. It will only return values that are relevant to that type of filter. If a between filter has a lower value set up as a default, but not an upper value, valueOne will be set and valueTwo will be null.
A list filter should only contain “valueList”.
A single entry filter should only contain “valueOne”.
A between filter should contain “valueOne” and “valueTwo”.
Yes.
In List example:
let filter = filters.getFilter('Demographic'); |
Between example:
let filter = filters.getFilter('Age at Camp'); |
Single Entry example:
let filter = filters.getFilter('Age at Camp'); |
String or Number.
Returns the filters default valueOne. This will only return anything if the filter has had a default value set while the content was being created. Will return null if the filter is a list type.
True.
let filter = filters.getFilter('Average Age at Camp'); |
String or Number.
Returns the filters default valueTwo. This will only return anything if the filter has had a default value set while the content was being created. Will always return null if the filter is not a between type.
True.
let filter = filters.getFilter('Average Age at Camp'); |
Array{String/Number}
Returns the filters default valueList. This will only return anything if the filter has had a default value set while the content was being created. Will always return null if the filter is not a list type.
True.
let filter = filters.getFilter('Demographic'); |
Nothing.
Resets the current filter to its default values. If the apply parameter is true, this will also immediately apply the filter to the report or dashboard that it is present on.
Apply - Boolean - Default: True
The filter Athlete Country has the default values of [‘AU’, ‘NZ’]
filter.setValue(['UK', 'US']); |
Nothing.
Clears the values from the filter and runs the report/dashboard if apply is true. All values will be set to undefined.
Apply - Boolean - Default: True
The filter Athlete Country has the default values of [‘AU’, ‘NZ’]
filter.setValue(['UK', 'US']); |
Nothing.
Resets the filter values from their current values to whatever is in the applied values object. This can serve as an “undo” function as it allows users to return their filters to the last state that the content was run in.
filter.setValue(['UK', 'US']); |
Nothing.
Sets the value of valueOne; will also apply and run the report/dashboard if apply is true.
Null is allowed as a value, from a user perspective this would just be clearing valueOne.
If setValueOne is called when using a list operator (In List or Not In List) this entire call will do nothing.
value - String, Number
apply - Boolean - Default: false
filter.setValueOne('Relaxation'); //Change the value to Relaxtion but don't immediately run the report |
Nothing.
Sets the value of valueTwo; will also apply and run the report/dashboard if apply is true.
Null is allowed as a value, from a user perspective this would just be clearing valueTwo.
If setValueTwo is called when using an operator that isn’t Between or Not Between this function call will do nothing.
value - String, Number
apply - Boolean - Default: false
//Filter is a between filter (Average Age at Camp) |
Nothing.
Sets the valueList property of the values objects. Can also immediately apply the filter to the report/dashboard if the apply parameter is true.
When used on a list operator, this will apply the array as it is to the filter.
If this is used on a single value operator, valueOne will be set to the first value in the array.
If this is called on a filter with a between operator, valueOne will be set to the first value in the array and valueTwo will be set to the second value in the array.
valueList - Array
apply - Boolean - Default: false
//Set the value of the filter "Demographic" to be Adventure, Family, Sport |
Nothing.
Catch all functions that attempt to apply the passed value to the correct location. If apply is true then it will also immediately apply to the report.
There are a number of different things that can occur when passing in different types of “value”.
If value is a Number or a String.
A list filter will treat this as you selecting a single value. It is equivalent to calling:
filter.setValueList(['single value']); |
A between or single entry filter will set valueOne to the passed value. Effectively this:
filter.setValueOne('first value'); |
If value is an Array,
A list filter will apply the array directly to its valueList attribute.
A between or single entry filter will take the first value from the Array and apply it to the filters valueOne attribute.
A between filter will take the second value from the Array and apply it to the filters valueTwo attribute.
filter.setValue([15, 35]); |
On a between filter will yield the same result as:
filter.setValueOne(15); |
If value is an Object,
Between and single entry filter will look for a “valueOne” attribute on that object and use that to populate the filters valueOne attribute.
Between filters will also look for a “valueTwo” attribute on the object and use that value to populate the filters valueTwo attribute.
List filters will look for a valueList attribute and use that to populate the filters valueList attribute.
value- String, Number, Array, Object
apply - Boolean - Default: false
Using on a between filter with an object:
let filter = filters.getFilter('Age at Camp'); filter.setValue({ |
Using on a list filter with an object and an array
let filter = filters.getFilter('Demographic'); |
Nothing.
Copies the filter's currently staged values, valueOne, valueTwo and valueList to the applied equivalents of those objects. If there are any changes between valueOne and appliedValueOne, valueTwo and appliedValueTwo and valueList and appliedValueList, an ‘applied’ event will be triggered with the values that have changed. See applied event for details.
Apply the value Adventure to the Demographic filter.
let filter = filters.getFilter('Demographic'); |
Nothing.
Updates the “possibleValues” of the filter to the passed Array. If an Array is passed then the filter will update its values and the Yellowfin UI widget will be updated accordingly. If null is passed then the possible values will be cleared. If any other type of object is passed it will be ignored.
The passed Array must be an Array of Objects with “value” and “description” properties.
The “value” property is what will be applied as part of the SQL query when the filter value is selected. The “description” property is what will be displayed to the user. In a lot of cases these might be the same. However you can use the “description” property to account for translations, or make a human readable version of the value.
[{ |
The values will be displayed in the order that they are added to the list.
Add an extra Demographic value to the current filter options for the filter Demographic:
let possibleValues = filter.possibleValues; |
Override the entire possible values array with values of your own:
let possibleValues = []; |
If the filter is part of a filter hierarchy any values you set through this property will be overwritten when the parent filter changes and pushes new values into this filter.
Number.
Creates a listener on an event which will call the callbackFunction whenever that particular event occurs.
When an event is set up a unique ID is assigned to it which is returned as the result of this function. This ID can be used by the removeEventListener function to remove the callback when you are done with it. If you are writing an application that requires loading and unloading reports it is recommended that you keep track of these listenerIds so that you can remove them when no longer needed.
See the event reference section for details about the events that this API will trigger itself.
It is also possible for developers to trigger their own events (see .trigger()) which can also be listened to using this function.
Create a listener on the changed object and remove it once the event occurs once:
let eventListenerId = filter.addEventListener('changed', function(event) { |
Nothing.
Removes the callback function associated with the passed listenerId. This will mean that when the event associated with that callback function occurs that callback will not be fired anymore.
let eventListenerId = filters.addEventListener('changed', function(event) { |
Nothing.
Triggers an event on the FilterObject and calls any listener functions that have been created for that event. This can be used to trigger custom events that you may have set up for the application.
When using a custom filter input we could trigger a filter click event, so that another part of the application could react to that.
//Add a 'userClick' listener to the filter object, which we will set up a trigger for later on. |
There are a number of events that will trigger on a filter object when a user or piece of code takes a certain action.
Any event that is triggered through the FilterObject will have an object that contains the filterUUID and the filter object itself.
filter.addEventListener('changed', function(event) { |
Occurs when any of the filter values changes. Triggers with an object that contains the values that changed as well as the previous values of all of those values.
Event - Object
Contains:
filter.addEventListener('applied', function(event) { |
Occurs when the filter is applied to the linked piece of content (report/dashboard). And the applied values change.
Event - Object
Contains:
filter.addEventListener('applied', function(event) { |
The applied event may be triggered in a case like this:
let filter = filters.getFilter('Demographic'); |
Due to the code creating a new Array when calling setValue. So any comparison that occurs will be of Array to Array.
The correct values will still be applied to the report.
Occurs when the reset function is called on the filter. This can occur from user interaction, clicking the reset button on a filter menu, or by a developer explicitly calling it.
filter.addEventListener('reset', function(event) { |
Event - Object
Contains:
Occurs when the clear function is called on the filter. This can occur from user interaction, or by a developer explicitly calling it.
Resetting a filter resets it to its default values. Where as clearing a filter will set it to have no values.
Event - Object
Contains:
filter.addEventListener(cleared, function(event) { |