Last active
December 14, 2015 22:19
-
-
Save KevinTCoughlin/5157766 to your computer and use it in GitHub Desktop.
Found what I believe to be a mistake on the MSDN Windows 8 JavaScript ListView tutorial http://msdn.microsoft.com/en-us/library/windows/apps/br211837.aspx DataArray item property should be "description" instead of "text" so that the template correctly uses the description property of each object. Otherwise the template returns undefined.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Windows 8 MSDN ListView Tutorial ListItem Template | |
<div id="mediumListIconTextTemplate" data-win-control="WinJS.Binding.Template"> | |
<div> | |
<!-- Displays the "picture" field. --> | |
<img data-win-bind="alt: title; src: picture" /> | |
<div> | |
<!-- Displays the "title" field. --> | |
<h4 data-win-bind="innerText: title"></h4> | |
<!-- Displays the "text" field. --> | |
<h6 data-win-bind="innerText: description"></h6> | |
</div> | |
</div> | |
</div> | |
// ListView Controller | |
<div id="basicListView" data-win-control="WinJS.UI.ListView" | |
data-win-options="{itemDataSource : DataExample.itemList.dataSource, itemTemplate: select('#mediumListIconTextTemplate')}"> | |
</div> | |
// JavaScript for ListView data source with corrected property of "text" to "description" to match template. | |
(function () { | |
"use strict"; | |
var dataArray = [ | |
{ title: "Basic banana", description: "Low-fat frozen yogurt", picture: "images/60banana.png" }, | |
{ title: "Banana blast", description: "Ice cream", picture: "images/60banana.png" }, | |
{ title: "Brilliant banana", description: "Frozen custard", picture: "images/60banana.png" }, | |
{ title: "Orange surprise", description: "Sherbet", picture: "images/60orange.png" }, | |
{ title: "Original orange", description: "Sherbet", picture: "images/60orange.png" }, | |
{ title: "Vanilla", text: "Ice cream", picture: "images/60vanilla.png" }, | |
{ title: "Very vanilla", description: "Frozen custard", picture: "images/60vanilla.png" }, | |
{ title: "Marvelous mint", description: "Gelato", picture: "images/60mint.png" }, | |
{ title: "Succulent strawberry", description: "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); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment