jquery mobile: отображение нескольких фильтров данных - PullRequest
4 голосов
/ 13 марта 2012

Я пытаюсь создать элемент управления списком в jquery-mobile, который позволяет некоторым элементам списка расширяться и отображать дочерние элементы. Моя цель состоит в том, чтобы этот список был фильтруемым, а атрибута jquery-mobile data-filter = "true" достаточно. К сожалению, он, кажется, унаследован от и элементов внутри, и в итоге я получаю несколько фильтров. Есть ли лучшая практика для предотвращения этого типа наследования в JQuery? Использование jquery для удаления посторонних тегов форм - это хак, который работает, но я бы предпочел сделать это как задумано.

Вот краткий пример:

<div data-role="content">
  <div class="choice_list">
    <h2>Select an item</h2><br />
    <ul data-role="listview" data-inset="true" data-filter="true">
      <li><a>Item</a></li>
      <li data-role="collapsible">
        <h3>Super Item</h3>
        <ul data-role="listview" data-inset="true">
          <li><a>Sub Item</a></li>
        </ul>
      </li>
    </ul>
  </div>
</div>

Пожалуйста, посмотрите на этот JSFiddle для примера: http://jsfiddle.net/harlomic/SsJjS/3/.

Ответы [ 2 ]

2 голосов
/ 13 марта 2012

Вы можете использовать CSS, чтобы скрыть два из трех входов фильтра:

/*hide all of the search filter forms*/
#test .choice_list form.ui-listview-filter {
    display : none;
}

/*show just the first search filter form*/
#test .choice_list form.ui-listview-filter:nth-child(-n+3) {
    display : block;
}

Вот демонстрационная версия: http://jsfiddle.net/SsJjS/5/

Обратите внимание, что test - это идентификатор страницыв котором найдены представления списка, а choice_list - это класс элемента контейнера для ваших представлений списка.

1 голос
/ 18 апреля 2012

Я также столкнулся с этой же проблемой с вложенными списками в JQM.

Я возился с этим, и если вы удалите data-role = "listview" из ваших дополнительных

...