Sort box directive

You use the sfSortBox directive when you create custom designers for your widgets. This directive provides functionality for displaying sort options.

To add the sort box directive, perform the following:

  1. Sitefinity CMS automatically registers the scripts you need and, if no other designer view with explicitly set priority exists, Sitefinity CMS sets your designer view priority 1. In case you need to have full control over the scripts that are loaded or you want to set custom priority, you can alternatively create your own DesignerView.YourView.json file. If you have a JSON file that matches the convention (even if empty), this automatic scripts registration will not occur. In the DesignerView.YourView.json file, add a scripts array.
    Use the following code:
  2. In the designerview-yourview.js file, place the following code:

    The code above assigns an array of custom sort options to the scoped variable sortItems. This adds two choice options to the sort box with values rating and views, respectively. When selected, the value of the choice option is bound to the scope variable sortValue.

  3. In the DesignerView.YourView.cshtml file, place the following tag where you want to render the sfSortBox directive: The sfSortBox directive exposes the following attributes:
    • sf-sort-options
      Accepts an array with sort options. If no value is provided for this attribute, the sfSortBox directive uses the default sort options:
      • Last created first - DateCreated DESC
      • Last modified first - LastModified DESC
      • Title (A-Z) - Title ASC
      • Title (Z-A) - Title DESC
    • sf-model
      Accepts a scope variable that references the selected sort option value.

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

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.

Web Security for Sitefinity Administrators

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.

Foundations of Sitefinity ASP.NET Core Development

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.

Was this article helpful?