0

現在、リストビューを使用して、Windows ストア アプリ (HTML/JS) の別の div のコンテンツを操作しようとしています。

リストビューの「oniteminvoked」ハンドラー内で呼び出す単純な関数があります。

メソッド呼び出し

MyApp.Util.addClassById(q(".item"), item.itemId, "selected");

(ここで、itemId は新しく選択したアイテムのもので、「q」は WinJS.Utilities.query のエイリアスです)

メソッド宣言

function addClassById(elements, selectedId, className) {

    elements.forEach(function (el) {

        var id = parseInt(el.attributes['data-id'].value, 10);

        if (id === selectedId) {
            util.addClass(el, className);
        }
        else {
            util.removeClass(el, className);
        }
    });
}

リストビューが読み込まれ、新しい項目を選択した後、これは期待どおりに機能します。ロードされないのはready、問題のページの機能中に呼び出そうとしたときです。

デバッグを実行すると、リスト内のアイテムに対するクエリがページ機能中に何も返さないように見えるreadyため、この時点でリストがレンダリングされておらず、DOM クエリは何も返さないと想定しています。

問題はこれです。アイテムがレンダリングされた後にアイテムを選択する (またはリストビューでアクションを実行する) ための推奨されるアプローチは何ですか?

関数を呼び出すことができる「アフターレンダー」タイプのイベントである可能性があると思いましたが、機能するものを見つけることができないようです。

何か案は？

4

2 に答える 2

0

このコードを見てください。リスト内のすべてのデータを繰り返し処理し、それを別のリストと比較して、データ内の ID に一致するすべての要素を選択します。

element.querySelector代わりに使用する場合document.getElementByIdは、準備完了関数でこれを使用できます。

var itemList= [
{ id: "11", name:"value1" }, 
{ id: "12", name:"value2" }
]

    var listView = document.getElementById("listViewOwners").winControl;

    var itemsInFavList = listView.itemDataSource.getCount()._value;
    for (var i = 0; i < itemsInFavList; i++) {
        var item = listView.itemDataSource.itemFromIndex(i);

        if (compareArray(itemList, item._value.data).length > 0)
        {    
            listView.selection.add(item._value.index);
        }
    }
}

//this function uses the filter function to check 
//if the element from the listView is contained in the data list
function compareArray(itemList, data){

    return itemList.lineOwners.filter(
        function (subitem) {
            return subitem.id === data.key
        });
    }
于 2013-12-13T09:05:31.547 に答える