нокаут + jqm странный флажок проблема - PullRequest
Новая
       7

нокаут + jqm странный флажок проблема

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

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

Вот что яполучать вместо.http://dl.dropbox.com/u/495070/shared/2012-03-28_09.03.33.000.png

вот jsFiddle , который демонстрирует проблему.

А вот (не такой полезный, как скрипта) фрагмент кода, который его генерирует. 

            <fieldset id="myList" data-role="controlgroup"  data-bind='foreach : acRoleOps()'>
                <legend>
                </legend>
                <br><br><br><h4><span data-bind="text: $root.opNameGet(OperationID)"></span></h4>

                <input data-theme="c" type="checkbox" data-role="controlgroup" data-bind="attr: { 'data-id': 'checkbox-bcreate-' + ID, name: 'checkbox-bcreate-' + ID, id: 'checkbox-bcreate-' + ID }, checked: BCreate, click: $parent.opPrivsToggle" />
                <label data-theme="c" data-bind="attr: { for: 'checkbox-bcreate-' + ID }">Create</label>

                <input data-theme="c" type="checkbox" data-role="controlgroup" data-bind="attr: { 'data-id': 'checkbox-bread-' + ID, name: 'checkbox-bread-' + ID, id: 'checkbox-bread-' + ID }, checked: BRead, click: $parent.opPrivsToggle" />
                <label data-theme="c" data-bind="attr: { for: 'checkbox-bread-' + ID }">Read</label>

                <input data-theme="c" type="checkbox" data-role="controlgroup" data-bind="attr: { 'data-id': 'checkbox-bedit-' + ID, name: 'checkbox-bedit-' + ID, id: 'checkbox-bedit-' + ID }, checked: BEdit, click: $parent.opPrivsToggle" />
                <label data-theme="c" data-bind="attr: { for: 'checkbox-bedit-' + ID }">Edit</label>

                <input data-theme="c" type="checkbox" data-role="controlgroup" data-bind="attr: { 'data-id': 'checkbox-bdelete-' + ID, name: 'checkbox-bdelete-' + ID, id: 'checkbox-bdelete-' + ID }, checked: BDelete, click: $parent.opPrivsToggle" />
                <label data-theme="c" data-bind="attr: { for: 'checkbox-bdelete-' + ID }">Delete</label>

            </fieldset>

Кто-нибудь видел это раньше?Если да, можете ли вы указать, где я ошибся?

Спасибо!

Ответы [ 3 ]

1 голос
/ 02 января 2013

Вам нужно использовать нокаут <!-- ko foreach: myItems --> http://knockoutjs.com/documentation/foreach-binding.html

http://jsfiddle.net/vNcNC/38/

0 голосов
/ 28 марта 2012

Я думаю, что это конфликт между временем, когда KO генерирует вашу разметку, и временем, когда jquery mobile применяет свой собственный скиннинг. Я нашел одну проблему с вашим кодом. Я думаю, что foreach не на том элементе. Я завернул ваш набор полей в новый div и применил к нему foreach. 

<div data-bind='foreach : acRoleOps()'>
                <fieldset id="opsList" data-role="controlgroup">

Я не слишком знаком с jquery mobile, но вот как я доказал, что это так. Я удалил ссылки и просто проверил, что KO генерирует правильную разметку. С вышеуказанным изменением, похоже, это так.

http://jsfiddle.net/madcapnmckay/THG9F/

Вот версия jquery для мобильных устройств со вставленной сгенерированной разметкой.

http://jsfiddle.net/madcapnmckay/tuWgM/1/

Как вы видите, KO генерирует правильную разметку, есть только конфликт синхронизации.

Надеюсь, это поможет.

0 голосов
/ 28 марта 2012

document.ready () не работает на мобильном телефоне jQuery, потому что страницы загружаются динамически. Вместо этого используйте событие pageInit. Смотрите здесь: http://jsfiddle.net/vNcNC/17/ Теперь у вас все еще есть проблемы с Knockout, но я не слишком знаком с ним, поэтому не могу помочь с ними.

...