0

我有一个为用户生成列表选项的表单，每个选项都有一个复选框、一个标签和一个输入字段。只有在勾选复选框时才应显示输入字段。这些选项是通过 JSON 调用生成的。

但是，在使用可见绑定时，淘汰赛似乎并没有达到我的预期。当我选中一行时，文本框会正确显示，但是当我取消选中它时，文本框会保持显示。

我怀疑这与可观察到的“选定”被覆盖或类似的事情有关，但我被困住了。

这是一个显示问题的小提琴：http: //jsfiddle.net/qccQs/2/

这是我在小提琴中使用的 HTML：

<div data-bind="template: { name: 'reason-template', foreach: reasonList }"></div>

<script type="text/html" id="reason-template">
    <div>
        <input type="checkbox" data-bind="value: selected" />
        <span data-bind="text: name"></span>
        <input type="text" class="datepicker" data-bind="value: date, visible: selected" />
    </div>
</script>

这是我在小提琴中使用的javascript：

function ReasonItem(name) {
    this.name = ko.observable(name);
    this.date = ko.observable(null);
    this.selected = ko.observable(false);
};

function MyViewModel() {
    var self = this;
    self.reasonList = ko.observableArray([  ])
};

var vm = new MyViewModel();

new Request.JSON({
    url: '/echo/json/',
    data: {
        json: JSON.encode({
            data: [
                { name: "Reason 1", selected: false, date: null },
                { name: "Reason 2", selected: false, date: null },
                { name: "Reason 3", selected: false, date: null }
            ]
        }),
        delay: 0
    },
    onSuccess: function(response) {
        $.each(response.data, function(index, reason) {
            vm.reasonList.push(new ReasonItem(reason.name));
        });
    }
}).send();

ko.applyBindings(vm);

关于如何让它表现得像我预期的那样有什么想法吗？

4

1 回答 1

2

对于checkbox您需要使用的类型的输入，checked而不是value：

<input type="checkbox" data-bind="checked: selected" />

请参阅淘汰赛文档。

于 2013-07-31T11:22:07.587 回答