Filtering dynamic items by custom taxonomy in the front end

Filtering dynamic items by custom taxonomy in the front end

August 29, 2012 0 Comments

The content you're reading is getting on in years
This post is on the older side and its content may be out of date.
Be sure to visit our blogs homepage for our latest news, updates and information.

Since the release of the Module Builder we have received number of requests how to filter items by custom taxonomy from the generated widget. Here I am going to show how with very little custom implementation this can be achieved.

First we need to have a dynamic module with a custom classification field, for instance Countries. Refer to Sitefinity documentation how to create one.

All we are going to do is to add a section to the widget designer template that will handle selecting custom taxonomies by which the content is going to be filtered and after that we will register the new widget designer in the settings.

Get the template “DynamicContentSelectorsDesignerView.ascx” that I have attached to this post and add it to your project. In my case I have a folder “Templates” in which the template is copied. Then edit the template as follows:

If you have a hierarchical taxonomy add this “designers” element:

<designers:FilterSelectorItem ID="FilterSelectorItem4" runat="server" Text="By Custom Classification"
                    GroupLogicalOperator="AND" ItemLogicalOperator="OR" ConditionOperator="Contains"
                    QueryDataName="fieldname" QueryFieldName="fieldname" QueryFieldType="System.Guid">
                    <SelectorResultView>
                        <sitefinity:HierarchicalTaxonSelectorResultView ID="HierarchicalTaxonSelectorResultView2" runat="server" TaxonomyId="xxxxx-xxxx-xxxxx-xxxx-xxxx" WebServiceUrl="~/Sitefinity/Services/Taxonomies/HierarchicalTaxon.svc"
                            AllowMultipleSelection="true" HierarchicalTreeRootBindModeEnabled="false">
                        </sitefinity:HierarchicalTaxonSelectorResultView>
                    </SelectorResultView>
                </designers:FilterSelectorItem>
If you have a flat taxonomy use the following designer:


<designers:FilterSelectorItem ID="FilterSelectorItem4" runat="server" Text="By Geographic Region"
                    GroupLogicalOperator="AND" ItemLogicalOperator="OR" ConditionOperator="Contains"
                    QueryDataName="fieldname" QueryFieldName="fieldname" QueryFieldType="System.Guid">
                    <SelectorResultView>
                        <sitefinity:FlatTaxonSelectorResultView ID="FlatTaxonSelectorResultView1" runat="server" TaxonomyId="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" WebServiceUrl="~/Sitefinity/Services/Taxonomies/FlatTaxon.svc"
                            AllowMultipleSelection="true">
                        </sitefinity:FlatTaxonSelectorResultView>
                    </SelectorResultView>
                </designers:FilterSelectorItem>

Note that the value for TaxonomyId is unique for every application. The easiest way to find it is to add categories widget to a page, edit the widget, delete the value in TaxonomyId field and save then the GUIDs of all of the taxonomies in your application will appear.

QueryDataName and QueryFieldName are the name of the content type taxonomy field. You can find it by editing opening your content type for edit. Just copy the name of the taxonomy field in your module and add it as a value to these properties.
Then go to Sitefinity backend -> Administration -> Settings -> Advanced -> Controls -> ViewMap  and create a new one with the following values:

HostType: Telerik.Sitefinity.Web.UI.ControlDesign.DynamicContentSelectorsDesignerView 

LayoutTemplatePath: ~/Templates/DynamicContentSelectorsDesignerView.ascx (the path to the template)

Save and restart your application. Go to pages, add the dynamic content type widget to a page, edit it and you can see that there is a selector for your custom taxonomy. Select some taxons, save and you can view that only items with that taxon are displayed.

Here is the template that should be used.

progress-logo

The Progress Guys

View all posts from The Progress Guys on the Progress blog. Connect with us about all things application development and deployment, data integration and digital business.

Comments
Comments are disabled in preview mode.
Topics
 
 
Latest Stories in
Your Inbox
Subscribe
More From Progress
d12fcc0bdb669b804e7f71198c9619a7
5 Questions Automakers Should Ask to Improve Asset Uptime
Download Whitepaper
 
SF_MQ_WCM
2018 Gartner Magic Quadrant Web Content Management (WCM)
Download Whitepaper
 
What-Serverless-Means-For-Enterprice-Apps-Kinvey
What Serverless Means for Enterprise Apps
Watch Webinar