WinJS - добавление стиля «selected» к первому элементу списка в загрузке

В настоящее время я пытаюсь использовать listview для управления содержимым отдельного div в приложении Windows Store (HTML/JS).WinJS - добавление стиля «selected» к первому элементу списка в загрузке

У меня есть простая функция, которую я вызываю внутри обработчика oniteminvoked для моего списка.

Метод вызов

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

(Где item.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); 
     } 
    }); 
}

Это работает, как и ожидалось после загрузки моего списка, и я выбираю новый i стем. Когда он не загружается, я пытаюсь вызвать его во время моей функции ready для рассматриваемой страницы.

Когда я проходил отладку, кажется, что мой запрос для элементов в списке ничего не возвращает во время страниц ready, поэтому я предполагаю, что этот список не был отображен на данный момент, а DOM запрос ничего не возвращает.

Итак, вопрос в том, какой рекомендуемый подход выбрать элемент (или выполнить действие в виде списка) после его визуализации?

Я думал, что это может быть событие типа afterrender, где я мог бы вызвать функцию, но я не могу найти ничего, что сработает.

Любые идеи?

источник

2013-07-22 dougajmcdonald

Лучший способ, которым я знаю это сделать, - захватить событие onloadingstatechanged и подождать, пока ListView будет «загружен». Вы можете увидеть, как, посетив мой пост в блоге http://codefoster.com/loadingstates

источник

2013-07-22 20:22:09

У меня такая же проблема, пытаясь выбрать элемент в списке. Я могу выбрать его с помощью listView.selection.set (index), где index - это число, но как я могу найти элемент, который я хочу программным образом выбрать в списке? –

После того, как список был загружен, у вас есть доступ ко всему представлению DOM, но не к базовым данным. Самый простой способ идентификатора - это программно добавить атрибут data в dom, а затем искать его. Например, если вы добавите в элемент data-id = "17", вы можете повторить итерацию своего списка (после его загрузки) и прочитать значения идентификатора данных, ищущие тот, который вы хотите. –

Пожалуйста, взгляните на мой ответ на этот вопрос, я думаю, что я нахожу способ перебора элементов списка. Было бы неплохо узнать, приемлемо ли это, потому что об этом немного документации. благодаря –

Посмотрите на этот код, он перебирает все данные в списке и сравнивает его с другим списком, чтобы выбрать каждый элемент, соответствующий идентификатору в данных.

и если вы используете 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-13 09:05:31

WinJS - добавление стиля «selected» к первому элементу списка в загрузке

ответ

Смежные вопросы