Use a page selector

This tutorial demonstrates how to add a page selector in a MVC widget designer's view. For more information, see Pages in Sitefinity. For more detailed information on selectors in MVC Feather, see the basic principles of using a content selector.

Adding a page selector

1. In your DesignerView.YourView.json file you have to add a scripts array. The content of the file should be similar to:

{ "priority": 1, "components" : ["sf-page-selector"] } ``` 2. In your designerview-yourview.js place the following snippet right before the definition of your custom view controller (note that the designerview-yourview.js should be place inside the ~/Mvc/Scripts/[WidgetName] folder):

```js

var designerModule = angular.module('designer'); angular.module('designer').requires.push('sfSelectors'); ``` 3. In your DesignerView.YourView.cshtml place the following tag somewhere in the html:

```html

```

You can use the attributes sf-selected-item and sf-selected-item-id to access the selected value. If multiple selection of items is enabled, you must use sf-selected-items and sf-selected-ids. For more information on multiple selection of items, see Using a multiple items selector.

The values of the attributes are scope properties that you must have added in your widgets controller:

public string SelectedItem
{
    get;
    set;
}

public string SelectedItemId
{
    get;
    set;
}