Export (0) Print
Expand All
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

data-win-control property

Applies to Windows and Windows Phone

Makes a div element host the specified Windows Library for JavaScript control.

Important  The data-win-control property is not supported within iframe elements.


<div data-win-control="controlName" />

Property value

Type: String

The fully qualified name of the WinJS control to host. For example, "WinJS.UI.ToggleSwitch".


The WinJS toolkit provides several useful controls that aren't a part of HTML5, such as the FlipView, ListView, and ItemContainer controls. Unlike HTML controls, WinJS controls don't have dedicated markup elements: you can't create a ItemContainer control by adding a <itemcontainer /> element.

To use a WinJS control, you create a div element and use the data-win-control attribute to specify the type of control you want. To add a ItemContainer control, you'd set the attribute to "WinJS.UI.ItemContainer".

The following example uses the data-win-control attribute to create a ItemContainer control.

<div id="ratingControlHost" data-win-control="WinJS.UI.ItemContainer"></div>

Before the control will work, you must activate your controls by calling the WinJS.UI.processAll function (for all controls) or the WinJS.UI.process function (for a single control) from your code behind. The WinJS.UI.processAll function processes the document and activates any WinJS controls that you've declared in markup.


Minimum supported client

Windows 8 [Windows Store apps only]

Minimum supported server

Windows Server 2012 [Windows Store apps only]

Minimum supported phone

Windows Phone 8.1



See also

Quickstart: adding WinJS controls



© 2015 Microsoft