复选框没有在淘汰赛中被选中答案

【问题标题】：Checkbox doesn't get checked in knockout复选框没有在淘汰赛中被选中
【发布时间】：2012-09-29 13:10:32
【问题描述】：

我有一个用于更新数据的复选框和单击事件。当我单击复选框时，数据正在更新，但未选中复选框。

这是我的html代码：

<td>
 <input type="checkbox" data-bind="checked: status, disable: status, click: $root.UpdateStatus" />
</td>

这是我的脚本：

self.UpdateStatus = function (tblUsers) {
    $.ajax({
        type: "POST",
        url: 'SinglePageApp.aspx/UpdateStatus',
        data: "{statusVal: 'true',goalId: " + tblUsers.goalId + "}",
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            alert(result.d);
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert(textStatus);
            alert(errorThrown);
        }
    });
};

我希望我的复选框在被点击时被选中。然后在单击复选框后放置更新的数据。

【问题讨论】：

标签： javascript asp.net knockout.js

【解决方案1】：

如果 status = false，您似乎禁用了该复选框，但将 status 设置为 true 的唯一方法是选中它。这就是为什么即使敲除知道它已被点击，复选框也不会被选中的原因。

由于它被禁用，您将无法选中复选框，因此您必须删除disable: status 数据绑定，或者将disable 逻辑放置在某个位置，以便您可以实际更改复选框的值。

【讨论】：

【解决方案2】：

这是因为 Knockout 中事件处理程序的默认行为是禁用事件的默认操作。在这种情况下，您的 click 处理程序会执行此操作。

我推荐的一个解决方案是避免使用click 处理程序，并让您的UpdateStatus 作为状态订阅运行。在您的视图模型构造函数中，您应该添加self.status.subscribe(self.UpdateStatus, self);

另一种解决方案是提到的here，它涉及从您的click 处理程序返回true。

【讨论】：

【解决方案3】：

见：http://knockoutjs.com/documentation/click-binding.html

注意 3：允许默认点击操作
默认情况下，Knockout 将阻止点击事件采取任何默认动作。这意味着，如果您在 a 标记（链接），例如，浏览器只会调用您的处理程序函数，并且不会导航到链接的 href。这是一个有用的默认是因为当你使用点击绑定时，通常是因为您将链接用作操作视图的 UI 的一部分模型，而不是作为到另一个网页的常规超链接。

但是，如果您确实想让默认点击操作继续进行，只需从您的点击处理函数返回 true。

编辑： 添加了显示在函数中返回true 的位置的示例。它必须从实际函数本身返回，而不是 Ajax success 或 error 处理程序。

self.UpdateStatus = function (tblUsers) {
    $.ajax({
        type: "POST",
        url: 'SinglePageApp.aspx/UpdateStatus',
        data: "{statusVal: 'true',goalId: " + tblUsers.goalId + "}",
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            alert(result.d);
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert(textStatus);
            alert(errorThrown);
        }
    });
    // Return true to allow default click action.
    return true;
};

【讨论】：

我已经用你的代码对此进行了测试，它适用于 IE9 和 Firefox。确保您的 return true; 不在 $.ajax() 调用中。
对不起，我是淘汰赛的初学者。我应该把 return true 放在哪里？我已经在 webmethod 'UpdateStatus' 中尝试过了。
感谢 Willem Duncan，我在 $.ajax() 调用之后返回 true。现在它可以工作了。
我想一键关闭复选框，怎么可能？
这个答案太棒了......我不确定是什么导致它没有被检查:)

【解决方案4】：

我尝试了here，当UpdateStatus 返回true（不阻止值更改）并且status 显然必须是一个可观察的值时它可以工作。

【讨论】：