When working with MVC widgets and widget designers, you may need to implement selectors for single or multiple items. The following article explains the basic principles of using such item selectors for various items, such as dynamic items, News items, taxa from a flat taxonomy. Selectors use standard Sitefinity CMS services to get the corresponding items. For example, the NewsService is used to get all created News items. Selectors also set the selected items into the designer properties.
The following example demonstrates how to use the News selector and is divided in two sections - selecting a single News item and selecting multiple News items.
You created a widget with a custom designer view and an AngularJS controller for the widget. For more information, see Create widgets.
Selectors are part of the Telerik.Sitefinity.Frontend assembly. Selectors are implemented as AngularJS directives. To use selectors, you need to:
The controller must have two properties:
The following code demonstrates how to implement the CustomWidgetController_SingleSelector.cs controller:
Next, you implement the custom designer view:
Finally, implement he AngularJS controller:
NOTE: The controller properties are not the same as the ones for the single item selector since they are in plural.
The following code demonstrates how to implement the CustomWidgetController_MultipleSelector.cs controller:
In the code above, to enable selection of multiple items for the selector, you set the sf-multiselect attribute true. Take notice that the attributes that bind the collections of items and item IDs are also different than the ones for a single item selector: sf-selected-ids and sf-selected-items. The selector model properties need to correspond to the ones you defined in the widget designer controller.
Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.
This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.
This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.
The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.
To submit feedback, please update your cookie settings and allow the usage of Functional cookies.
Your feedback about this content is important