ListView.currentItem property

Gets or sets an object that indicates which item should have keyboard focus and the focus state of that item.
Syntax
<div data-win-control="WinJS.UI.ListView" data-win-options="{ currentItem : value}"> </div>
var currentItem = listView.currentItem;
listView.currentItem = currentItem;
Property value
Type: Object
An object that contains these properties:
-
Type: Number
The index of the current item in the itemDataSource , or -1 if there is no currently focused item.
-
Type: String
The IItem.key that identifies the item in the itemDataSource, or null if there is no currently focused item.
-
Type: Boolean
When getting this property, this value is true if the item already has focus; otherwise, it's false. When setting this property, set this value to true if the item should get focus immediately; otherwise, set it to false and the item will get focus eventually.
-
Type: Boolean
true if the item displays the focus rectangle; otherwise, false.
Remarks
To obtain the items that are currently selected, use the selection property.
Examples
This example sets the currentItem to the third item in the list.
<div id="mediumListIconTextTemplate" data-win-control="WinJS.Binding.Template">
<div style="width: 282px; height: 70px; padding: 5px; overflow: hidden; display: -ms-grid;">
<!-- Displays the "picture" field. -->
<img data-win-bind="alt: title; src: picture"
src="#"
style="width: 60px; height: 60px; margin: 5px; -ms-grid-column: 1;"/>
<div style="margin: 5px; -ms-grid-column: 2">
<!-- Displays the "title" field. -->
<h4 data-win-bind="innerText: title"></h4>
<!-- Displays the "text" field. -->
<h6 data-win-bind="innerText: text"></h6>
</div>
</div>
</div>
<div id="basicListView" data-win-control="WinJS.UI.ListView"
data-win-options="{itemDataSource : DataExample.itemList.dataSource,
itemTemplate: select('#mediumListIconTextTemplate'),
layout : {type: WinJS.UI.GridLayout},
currentItem : {index: 2, hasFocus: true, showFocus: true}}"
>
</div>
This example defines the data for the ListView in a separate JavaScript file. (For the ListView to access the data, add a reference to the JavaScript file to the HTML page that contains the ListView.)
// data.js (function () { "use strict"; var dataArray = [ { title: "Basic banana", text: "Low-fat frozen yogurt", picture: "images/60banana.png" }, { title: "Banana blast", text: "Ice cream", picture: "images/60banana.png" }, { title: "Brilliant banana", text: "Frozen custard", picture: "images/60banana.png" }, { title: "Orange surprise", text: "Sherbet", picture: "images/60orange.png" }, { title: "Original orange", text: "Sherbet", picture: "images/60orange.png" }, { title: "Vanilla", text: "Ice cream", picture: "images/60vanilla.png" }, { title: "Very vanilla", text: "Frozen custard", picture: "images/60vanilla.png" }, { title: "Marvelous mint", text: "Gelato", picture: "images/60mint.png" }, { title: "Succulent strawberry", text: "Sorbet", picture: "images/60strawberry.png" } ]; var dataList = new WinJS.Binding.List(dataArray); // Create a namespace to make the data publicly // accessible. var publicMembers = { itemList: dataList }; WinJS.Namespace.define("DataExample", publicMembers); })();
Requirements
|
Minimum WinJS version |
WinJS 3.0 |
|---|---|
|
Namespace |
WinJS.UI |
See also