konckoutによるjquery mobile listviewへのbinding

いろいろ試した結果、いくつかの発見を纏める。
・checkboxをlabelの中に入れると、visible bindingが効かなくなる
・「$index」そのまま使うと、文字列操作の式でfunctionの文字列が使われる。0からの値で利用したい場合は「$index()」を使う

JS
var appViewModel = { cards: ko.observableArray([]),
                   addMode: ko.observable(false)};

ko.applyBindings(appViewModel);

HTML
 　　 <ul data-role="listview" id="card_list" data-inset="true" data-bind="foreach: cards">
                <li>
                    <a href="#">
                        <input type="checkbox" name ="card-to-add"
                                       data-bind="visible: $root.addMode,
                                                  attr: {id: 'checkbox-'+$index()}">
                        <label data-bind="attr: {for: 'checkbox-'+$index()}">
                            <span data-bind="text: CARDNAME"></span>
                        </label>
                    </a>
                </li>
            </ul>

jquery mobileのcheckboxを選択できる状態にする

jquery mobileを使って、JSで動的にcheckboxを追加しても、クリックしても何も反応はない。そこで、以下のJSを挿入することで解決できた。

$("[type=checkbox]").checkboxradio(); //add this line to enable checkbox