Question

我已经使用我的代码创建了一个jsfiddle：http://jsfiddle.net/hw7c9b76/但不幸的是它并没有真正显示问题，因为数据不是持久的。

当我在数据库中有几个条目并且我重新加载时，复选框都会被选中，并且显示应隐藏的字段，即使editable属性设置为false。

有没有办法确保隐藏字段并在加载时取消选中按钮？

这是html，因为stackoverflow不允许我发布一个没有包含代码的jsfiddle链接：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Knockout experiment</title>
</head>

<body>
    <form data-bind="submit: addFriend">
        Add Friend: <input data-bind="value: newFriendNameText" placeholder="Name" /> <input data-bind="value: newFriendAgeText" placeholder="Age" />
        <button type="submit">Add</button>
    </form>
    <ul data-bind="foreach: friends">
        <li>
            <span data-bind="text:name"></span> 
            <span data-bind="text:age"></span>
            <input data-bind="visible: editable, textInput: name" />
            <input data-bind="visible: editable, textInput: age" />
            <a href="#" data-bind="visible: editable, click: $parent.updateFriend">Save Edits</a>
            <input type="checkbox" value="edit" data-bind="checked:editable">Make Edits</a>
            <a href="#" data-bind="click: $parent.removeFriend">Delete</a>
        </li>

    </ul>
    <pre data-bind="text: ko.toJSON($data, null, 2)"></pre>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-min.js"></script>
    <script src="knockout-mapping.js"></script>
    <script src="script.js"></script>
</body>
</html>

Answer 1

您服务中的数据不一致。不一致就是在返回可编辑的值

时

来自服务的数据

friends = [{"name":"aaad","age":"30","editable":"false","id":1},
               {"name":"ffff","age":"4","editable":"false","id":2},
               {"name":"werw","age":"3","editable":"false","id":3}];

数据应该是

friends = [{"name":"aaad","age":"30","editable":false,"id":1},
           {"name":"ffff","age":"4","editable":false,"id":2},
           {"name":"werw","age":"3","editable":false,"id":3}];

看看这个JS小提琴http://jsfiddle.net/Dnyanesh/k96tzdbz/（我复制了你的代码并制作了一些内容）这个小提琴按预期工作。

现在什么是可编辑的根本原因值，当它不是false时将被视为真。因为javascript中没有类型安全你的价值＆＃34; false＆＃34;也正在考虑并且可编辑设置为真。

如果您无法控制所使用的服务所使用的数据，则可以将eiditable值设置为false。我已经更新了以下更改。 http://jsfiddle.net/Dnyanesh/k96tzdbz/1/

        ko.utils.arrayForEach(friends, function(fr){
           var frdCls = new FriendClass(fr)
            self.friends.push(frdCls);
        });

在这种情况下，无论数据来自服务，它都将设置为false。

默认情况下在knockout.js中选中复选框

1 个答案: