Maksym Ponomarenko
Sitecore Consulting

Preselect Facets in Sitecore Speak FilterControl


The Sitecore Speak component “FilterControl“ doesn’t allow to preselect facets programmatically. The feature can be pretty useful in some cases, so I describe a small workaround below.


Sitecore FilterControl

 

In my example the Speak app has one Dashboard page with a list and filter. The list shows all Product items with fields Name, Color and Type. Usually, the SearchDataSource is good enough, when you just need to read items.

 

Sitecore Dashboard

 

Datasource and Facets components are bound in the standard way:

 

FilterControl:


Sitecore FilterControl Edit Rendering Properties

 

Datasource:


Sitecore Datasource FacetsRootItemID

 

The binding works in the way where the facet are reload each time when the datasource items list is updated. After that all facets become unselected.

To preselect some facets programmatically we can handle an event “change:facet” that triggers each time when facets list is updated.

This example will preselect a facet “Color” with value “Red”

define(["sitecore"], function (Sitecore) {
var Demo = Sitecore.Definitions.App.extend({


// in the initialized method register an event
initialized: function () {
var self = this;
this.Facets.on("change:facets", self. selectFacet, self);
},

// select facet “Color” with value “Red” each time when the even “change:facets” was triggered
selectFacet: function (name, value) {
var selectedFacetName = “Color”,
selectedFacetValue = “Red”;
var facets = this.FilterControl1.viewModel.facetList();
$.each(facets, function (i, facet) {
if (facet.name == selectedFacetName) {
$.each(facet.values(), function (j, facetValue) {
if (facetValue.value == selectedFacetValue) {
facetValue.checked(true);
}
});
}
});
}
});
return Demo;
});

 

 

Kommentare
Es wurden noch keine Kommentare zu diesem Eintrag geschrieben.
Kommentar hinzufügen
Vor und Zuname
E-Mail
E-Mail bei weiteren Kommentaren
Mein Kommentar