Answered by:
Listview and binding. Getting repeated output

Question
-
I have managed to bind data obtained dynamically to a Listview, but I am having problems displaying it. I have followed quickstart and searched on line but am still stuck.
Here is the javascript
(function () { WinJS.UI.processAll(); "use strict"; var scores = new Object(); var scored = new WinJS.Binding.List(); function getScores() { document.getElementById('scoreListView').style.display = "block"; document.getElementById('experimental').style.display = "none"; document.getElementById('basicListView').style.display = "none"; var roamingSettings = Windows.Storage.ApplicationData.current.roamingSettings; var scoreArray = roamingSettings.createContainer("scores", Windows.Storage.ApplicationDataCreateDisposition.Always); for (var x = 0; x < 12; x++) { if (!scoreArray.values[x]) { scoreArray.values[x] = "No score recorded"; } scores = { title: game.copiedSA[x].title, time: scoreArray.values[x], match: game.copiedSA[x].match }; scored.push(WinJS.Binding.as(scores)); }
The html is:
<div id="mediumListIconTextTemplate" data-win-control="WinJS.Binding.Template"> <div style="width: 150px; height: 100px;"> <!-- Displays the "title" field. --> <h4 data-win-bind="innerText: scored.time" style="width:100px;"></h4> <!-- Displays the "time" field. --> <h6 data-win-bind="innerText: 'time'"></h6> </div></div> <div id="scoreListView" data-win-control="WinJS.UI.ListView" data-win-options="{itemDataSource:getScores.scored.dataSource, itemTemplate: select('mediumListIconTextTemplate')}"></div>
Whatever I do I keep getting:
Have tried various options but I cannot get past this output.
Can anyone tell me where I am going wrong please?
Many thanks
- Edited by chickfeed Wednesday, September 17, 2014 12:47 PM
Wednesday, September 17, 2014 12:46 PM
Answers
-
Tried every which way, but still stuck.
Have decided to ditch listview and do it using standard js, html and css.
- Marked as answer by Matt SmallMicrosoft employee, Moderator Friday, October 3, 2014 4:54 PM
Tuesday, September 30, 2014 8:10 AM
All replies
-
Please post the rest of your code for this issue.
Matt Small - Microsoft Escalation Engineer - Forum Moderator
If my reply answers your question, please mark this post as answered.
NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.Thursday, September 18, 2014 12:04 PMModerator -
Sorry for late reply.
I could not log into my account yesterday for some unknown reason.
There's not a lot more code.
The namespace is
WinJS.Namespace.define("getScores", { getScores: getScores, scored: scored });
The event listener handler (on a different js file - on the default.js page) for the get score button on the app bar is
function scorePageHandler() { //only allow to view from menu or from success or help document.getElementById('successOuter').style.display = "none"; document.getElementById('basicListView').style.display = "none"; //show hide app bar buttons as needed document.getElementById('scorepage').style.display = "block"; getScoreList(); getScoreTemplate(); } function scoreCloseHandler() { document.getElementById('scorepage').style.display = "none"; document.getElementById('basicListView').style.display = "block"; }
The namespace for these:
WinJS.Namespace.define('game', { game: game, copiedSA: copiedSA });
The event handlers aredocument.getElementById('barscorepage').addEventListener("click", getScores.getScores, false); document.getElementById('barclosescores').addEventListener("click", scoreCloseHandler, false);
The data for the games settings -
var SettingsArray = [ {index: 0, title: "Easy Match", text: "Match 8 pairs of photos", picture: "images/listview/matcheasy.png", copies: 2, numdifferentpics: 8, match: 1 }, { index: 6, title: "Easy Memory", text: "Easy", picture: "images/listview/memoryeasy.png", copies: 2, numdifferentpics: 8, match: 0 }, { index: 1, title: "Medium Match", text: "Match 18 pairs of photos", picture: "images/listview/matchmedium.png", copies: 2, numdifferentpics: 18, match: 1 }, { index: 7, title: "Medium Memory", text: "", picture: "images/listview/memorymedium.png", copies: 2, numdifferentpics: 18, match: 0 }, { index: 2, title: "Hard Match", text: "Match 27 pairs of photos", picture: "images/listview/matchhard.png", copies: 2, numdifferentpics: 27, match: 1 }, { index: 8, title: "Hard Memory", text: "Find 27 pairs of photos", picture: "images/listview/memoryhard.png", copies: 2, numdifferentpics: 27, match: 0 }, //try adding image size { index: 3, title: "Very Hard Match", text: "Match 36 pairs of photos", picture: "images/listview/matchveryhard.png", copies: 2, numdifferentpics: 36, match: 1 }, { index: 9, title: "Very Hard Memory", text: "Find 36 pairs of photos", picture: "images/listview/memoryveryhard.png", copies: 2, numdifferentpics: 36, match: 0 }, { index: 4, title: "Atrocious Match", text: "Match 50 pairs of photos", picture: "images/listview/matchatrocious.png", copies: 2, numdifferentpics: 50, match: 1 }, { index: 10, title: "Atrocious Memory", text: "Find 50 pairs of photos", picture: "images/listview/memoryatrocious.png", copies: 2, numdifferentpics: 50, match: 0 }, { index: 5, title: "Really Atrocious Match", text: "Match 80 pairs of photos", picture: "images/listview/matchreallyatrocious.png", copies: 2, numdifferentpics: 80, match: 1 }, { index: 11, title: "Really Atrocious Memory", text: "Find 80 pairs of photos", picture: "images/listview/memoryreallyatrocious.png", copies: 2, numdifferentpics: 80, match: 0 } ]; var copiedSA = {}; for (var x = 0; x < SettingsArray.length; x++) { copiedSA[x] = SettingsArray[x];}
I think that is all of it.
Many thanks.
Friday, September 19, 2014 8:51 AM -
Tried every which way, but still stuck.
Have decided to ditch listview and do it using standard js, html and css.
- Marked as answer by Matt SmallMicrosoft employee, Moderator Friday, October 3, 2014 4:54 PM
Tuesday, September 30, 2014 8:10 AM