2

我正在学习 WinJs，但我的应用程序有问题。我有一个在 Gridlayout 中显示的 Grouped ListView。我使用模板，在模板的标题中，有三个按钮。在我的 Javascript 中，我有一个按重要性过滤列表然后对其进行分组的函数。当我单击按钮时，我传递了临界值，然后在过滤器中使用它。我遇到的问题是，当单击按钮但显示没有改变时，会调用执行过滤和分组的函数。

我搜索了该站点并发现了一些我认为可能会有所帮助的主题，但它们都是针对 Android 应用程序的。

谁能告诉我我做错了什么？

代码片段：

[数据.js]

(function () {
  "use strict";

  var groupedItemsList;
  var jobStatusCriticality = "";
  var groupedJobs, filteredDataList;

  var dataList = new WinJS.Binding.List();

  function listData() { //removed for web}

  WinJS.Namespace.define("JobGroup.Functions", {
    setupJobGroup: function setupGroup(jsc) {
        if (jsc != "") {
          filteredDataList = dataList.createFiltered(
                function (dataItem) {
                    if (dataItem.jobCriticality == jsc) {
                        return true;
                    }
                    else {
                        return false;
                    }
                }
          );
          filteredDataList.notifyReload();
        }
        else {
            filteredDataList = dataList;
        }

        groupedJobs = filteredDataList.createGrouped(
            function (dataItem) {
                return dataItem.jobStatus;
            },
            function (dataItem) {
                return { status: dataItem.jobStatus };
            },
            function (first, second) {
                return first.charCodeAt(0) - second.charCodeAt(0);
            }
        );
    }
});

JobGroup.Functions.setupJobGroup(jobStatusCriticality);
WinJS.Namespace.define("DataExample", { myList: groupedJobs });
WinJS.UI.processAll().then(listData);

[默认.html]

<div id="mediumListIconTextTemplate" data-win-control="WinJS.Binding.Template">
  //remove for web
</div>

<div id="headerTemplate" data-win-control="WinJS.Binding.Template">
  <div id="sortType"> 
    <div id="sortAll"><span><button id="viewAllBtn" type="button" onclick="JobGroup.Functions.setupJobGroup('')">View All</button></span></div>
    <div id="sortCritical"><span><button id="viewCriticalBtn" type="button" onclick="JobGroup.Functions.setupJobGroup('CRITICAL')">Critical</button></span></div>
    <div id="sortWarning"><span><button id="viewWarningBtn" type="button" onclick="JobGroup.Functions.setupJobGroup('WARNING')">Warning</button></span></div>
  </div>
</div>

<div id="groupedListView"
  data-win-control="WinJS.UI.ListView" 
  data-win-options="{itemDataSource: DataExample.myList.dataSource, 
    itemTemplate: select('#mediumListIconTextTemplate'),
    groupDataSource: DataExample.myList.groups.dataSource,
    groupHeaderTemplate: select('#headerTemplate'),
    layout: {type: WinJS.UI.GridLayout}}">
</div>

[default.js] //包含标准默认代码

4

1 回答 1

1

快速扫描，所以你可能不得不玩这个，但我认为这是在球场上......

您需要使用新的dataSource更新ListView。您现在连接的方式是将List绑定到myList.dataSource，这实际上是groupedJobs。当您单击一个按钮时，您会创建一个新的数据排序，但createGrouped会创建一个全新的对象，因此不会通知ListView发生了某些变化 - ListView仍绑定到旧对象。打电话

groupedListView.winControl.itemDataSource = groupedJobs.dataSource;
groupedListView.winControl.groupDataSource = groudedJobs.groups.dataSource;

在你的listData函数的末尾会做我认为的伎俩。

于 2012-12-13T14:58:13.863 回答