Overview
The sap.m.FacetFilter control is used to provide filtering functionality with multiple parameters and supports the users in finding the information they need from potentially very large data sets.
Your app can have dependencies between facets where selection of filter items in one facet list limits the list of valid filters in another facet list.
The FacetFilter uses FacetFilterList and FacetFilterItem to model facets and their associated filters.
Note: FacetFilterList is a subclass of sap.m.List and supports growing enablement feature via the property growing
. When you use this feature, be aware that it only works with one-way data binding. Having growing feature enabled when the items
aggregation is bound to a model with two-way data binding, may lead to unexpected and/or inconsistent behavior across browsers, such as unexpected closing of the list.
Usage
Use the FacetFilter if your app displays a large list of items that can be grouped by multiple parameters, for example products by category and supplier. With the FacetFilter, you allow the users to dynamically filter the list so it only displays products from the categories and suppliers they want to see.
Responsive behavior
The FacetFilter supports the following two types, which can be configured using the control's type
property:
- Simple type (default) - only available for desktop and tablet screen sizes. The active facets are displayed as individually selectable buttons on the toolbar.
- Light type - automatically enabled on smart phone sized devices, but also available for desktop and tablets. The active facets and selected filter items are displayed in the summary bar. When the user selects the summary bar, a navigable dialog list of all facets is displayed. When the user selects a facet, the dialog scrolls to show the list of filters that are available for the selected facet.
Additional Information For more information, go to
Developer Guide section in the Demo Kit and navigate to
More About Controls >
sap.m >
Facet FilterEvent Summary
reset(oControlEvent)Fired when the Reset button is pressed to inform that all FacetFilterLists need to be reset. Method Summary
sap.m.FacetFilter.extend(sClassName, oClassInfo?, FNMetaImpl?)Creates a new subclass of class sap.m.FacetFilter with name sClassName
and enriches it with the information contained in oClassInfo
. addList(oList)Adds some list to the aggregation lists
. attachReset(oData?, fnFunction, oListener?)Attaches event handler fnFunction
to the reset
event of this sap.m.FacetFilter
. destroyLists()Destroys all the lists in the aggregation lists
. detachReset(fnFunction, oListener)Detaches event handler fnFunction
from the reset
event of this sap.m.FacetFilter
. fireReset(mArguments?)Fires event reset
to attached listeners. getType()Gets current value of property type
. indexOfList(oList)Checks for the provided sap.m.FacetFilterList
in the aggregation lists
. insertList(oList, iIndex)Inserts a list into the aggregation lists
. addStyleClass,
allowTextSelection,
attachBrowserEvent,
attachValidateFieldGroup,
checkFieldGroupIds,
clone,
detachBrowserEvent,
detachValidateFieldGroup,
fireValidateFieldGroup,
getAccessibilityInfo,
getBusy,
getBusyIndicatorDelay,
getControlsByFieldGroupId,
getFieldGroupIds,
getIdForLabel,
getRenderer,
getVisible,
hasStyleClass,
invalidate,
isBusy,
placeAt,
removeStyleClass,
rerender,
setBusy,
setBusyIndicatorDelay,
setFieldGroupIds,
setVisible,
toggleStyleClass,
triggerValidateFieldGroup $,
addCustomData,
addDependent,
addEventDelegate,
applyFocusInfo,
bindElement,
data,
destroy,
destroyCustomData,
destroyDependents,
destroyLayoutData,
destroyTooltip,
enhanceAccessibilityState,
findElements,
fireEvent,
focus,
getCustomData,
getDependents,
getDomRef,
getElementBinding,
getFocusDomRef,
getFocusInfo,
getInterface,
getLayoutData,
getMetadata,
getTooltip,
getTooltip_AsString,
getTooltip_Text,
indexOfCustomData,
indexOfDependent,
insertCustomData,
insertDependent,
prop,
removeAllCustomData,
removeAllDependents,
removeCustomData,
removeDependent,
removeEventDelegate,
setLayoutData,
setTooltip,
toString,
unbindElement addAggregation,
addAssociation,
applySettings,
attachFormatError,
attachModelContextChange,
attachParseError,
attachValidationError,
attachValidationSuccess,
bindAggregation,
bindContext,
bindObject,
bindProperty,
destroyAggregation,
detachFormatError,
detachModelContextChange,
detachParseError,
detachValidationError,
detachValidationSuccess,
findAggregatedObjects,
fireFormatError,
fireModelContextChange,
fireParseError,
fireValidationError,
fireValidationSuccess,
getAggregation,
getAssociation,
getBinding,
getBindingContext,
getBindingInfo,
getBindingPath,
getEventingParent,
getId,
getModel,
getObjectBinding,
getOriginInfo,
getParent,
getProperty,
hasModel,
indexOfAggregation,
insertAggregation,
isBound,
isInvalidateSuppressed,
isTreeBinding,
propagateMessages,
removeAllAggregation,
removeAllAssociation,
removeAssociation,
setAggregation,
setAssociation,
setBindingContext,
setModel,
setProperty,
unbindAggregation,
unbindContext,
unbindObject,
unbindProperty,
validateAggregation,
validateProperty Constructor Detail
new sap.m.FacetFilter(sId?, mSettings?)
Constructor for a new FacetFilter.
Accepts an object literal mSettings
that defines initial property values, aggregated and associated objects as well as event handlers. See sap.ui.base.ManagedObject for a general description of the syntax of the settings object.
The supported settings are:
- Properties
- Aggregations
- lists : sap.m.FacetFilterList[] (default)
- Events
- reset : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]
In addition, all settings applicable to the base type sap.ui.core.Control can be used as well.
Parameters:
{string} | sId? | ID for the new control, generated automatically if no ID is given |
{object} | mSettings? | Initial settings for the new control |
Event Detail
reset(oControlEvent)
Fired when the Reset button is pressed to inform that all FacetFilterLists need to be reset.
Parameters:
Method Detail
sap.m.FacetFilter.extend(sClassName, oClassInfo?, FNMetaImpl?): function
Creates a new subclass of class sap.m.FacetFilter with name
sClassName
and enriches it with the information contained in
oClassInfo
.
oClassInfo
might contain the same kind of information as described in sap.ui.core.Control.extend.
Parameters:
{string} | sClassName | Name of the class being created |
{object} | oClassInfo? | Object literal with information about the class |
{function} | FNMetaImpl? | Constructor function for the metadata object; if not given, it defaults to sap.ui.core.ElementMetadata |
Returns:
{function} | Created class / constructor function |
Returns a metadata object for class sap.m.FacetFilter.
Returns:
Adds some list to the aggregation lists
.
Parameters:
Returns:
Attaches event handler
fnFunction
to the
reset
event of this
sap.m.FacetFilter
.
When called, the context of the event handler (its this
) will be bound to oListener
if specified, otherwise it will be bound to this sap.m.FacetFilter
itself.
Fired when the Reset button is pressed to inform that all FacetFilterLists need to be reset.
Parameters:
{object} | oData? | An application-specific payload object that will be passed to the event handler along with the event object when firing the event |
{function} | fnFunction | The function to be called when the event occurs |
{object} | oListener? | Context object to call the event handler with. Defaults to this sap.m.FacetFilter itself |
Returns:
Destroys all the lists in the aggregation lists
.
Returns:
Detaches event handler
fnFunction
from the
reset
event of this
sap.m.FacetFilter
.
The passed function and listener object must match the ones used for event registration.
Parameters:
{function} | fnFunction | The function to be called, when the event occurs |
{object} | oListener | Context object on which the given function had to be called |
Returns:
Fires event reset
to attached listeners.
Parameters:
{Map} | mArguments? | The arguments to pass along with the event |
Returns:
getLiveSearch(): boolean
Gets current value of property
liveSearch
.
Enables/disables live search on all search fields except for the FacetFilterList search.
Default value is true
.
Returns:
{boolean} | Value of property liveSearch |
getShowPersonalization(): boolean
Gets current value of property
showPersonalization
.
If set to true
and the FacetFilter type is Simple
, then the Add Facet icon will be displayed and each facet button will also have a Facet Remove icon displayed beside it, allowing the user to deactivate the facet.
Default value is false
.
Returns:
{boolean} | Value of property showPersonalization |
getShowPopoverOKButton(): boolean
Gets current value of property
showPopoverOKButton
.
If set to true
, an OK button is displayed for every FacetFilterList popover. This button allows the user to close the popover from within the popover instead of having to click outside of it.
Default value is false
.
Returns:
{boolean} | Value of property showPopoverOKButton |
getShowReset(): boolean
Gets current value of property
showReset
.
Shows/hides the FacetFilter Reset button.
Default value is true
.
Returns:
{boolean} | Value of property showReset |
getShowSummaryBar(): boolean
Gets current value of property
showSummaryBar
.
Shows the summary bar instead of the FacetFilter buttons bar when set to true
.
Default value is false
.
Returns:
{boolean} | Value of property showSummaryBar |
Gets current value of property
type
.
Defines the default appearance of the FacetFilter on the device. Possible values are Simple
(default) and Light
.
Default value is Simple
.
Returns:
indexOfList(oList): int
Checks for the provided sap.m.FacetFilterList
in the aggregation lists
. and returns its index if found or -1 otherwise.
Parameters:
Returns:
{int} | The index of the provided control in the aggregation if found, or -1 otherwise |
Inserts a list into the aggregation lists
.
Parameters:
{sap.m.FacetFilterList} | oList | the list to insert; if empty, nothing is inserted |
{int} | iIndex | the 0 -based index the list should be inserted at; for a negative value of iIndex , the list is inserted at position 0; for a value greater than the current size of the aggregation, the list is inserted at the last position |
Returns:
Opens the FacetFilter dialog.
Returns:
Removes all the controls from the aggregation
lists
.
Additionally, it unregisters them from the hosting UIArea.
Returns:
Sets a new value for property
showPersonalization
.
If set to true
and the FacetFilter type is Simple
, then the Add Facet icon will be displayed and each facet button will also have a Facet Remove icon displayed beside it, allowing the user to deactivate the facet.
When called with a value of null
or undefined
, the default value of the property will be restored.
Default value is false
.
Parameters:
{boolean} | bShowPersonalization | New value for property showPersonalization |
Returns:
Sets a new value for property
showPopoverOKButton
.
If set to true
, an OK button is displayed for every FacetFilterList popover. This button allows the user to close the popover from within the popover instead of having to click outside of it.
When called with a value of null
or undefined
, the default value of the property will be restored.
Default value is false
.
Parameters:
{boolean} | bShowPopoverOKButton | New value for property showPopoverOKButton |
Returns: