如何在只读表单上显示复选框（ASP.NET）

Question

我有一个从数据库自动填写的只读表单。我有几个带有真/假值的字段，并希望它们显示为空或已选中的复选框。我可以对复选框控件进行数据绑定并禁用它，但随后它会显示为灰色。有没有一种简单的方法可以改变它，使其以正常、易于阅读的粗体显示，但仍然被禁用？如果没有，最好的方法是什么？我应该使用图像吗？

Answer 1

你也可以这样走。

<asp:CheckBox id="checkbox1" Text="Custom" onclick="javascript: return false;" />

这会将其呈现为

<input type="checkbox"
checked  onclick="javascript: return false;">Custom</input>

Answer 2

有趣的问题！

使用图像而不是普通复选框时，我只能看到一个问题，这就是活动复选框与禁用（基于图像）复选框的不同之处。因此，如果您选择图像路线，您可能会想要为所有复选框设置样式。 :)

您可以使用以下 jQuery 方法有效地禁用任何复选框（到目前为止，我只在 Chrome 和 IE 9 中进行了测试）。

$('.readonly:checkbox').click(function(e) {
    e.preventDefault();
});

这将“禁用”任何具有“readonly”类的复选框。

或者，您可以使用内联 JavaScript 函数（尽管不推荐，因为它会增加混乱和混淆）：

<input type="checkbox" onclick="event.preventDefault();" />

您使用“preventDefault()”而不是“return false”的原因是因为返回 false 将停止传播。这意味着您的点击事件不会冒泡到父元素。这可能会导致其他代码出现问题……但可能性不大。

另外，就像 Bala R 提到的那样，您不能依赖这些限制来工作。您的服务器端代码应该知道这些值是只读的，并且不要更新它们。

这是 jsFiddle 示例：http://jsfiddle.net/xixionia/3rXCB/

我希望这有帮助！ :)

Answer 3

您可以使用 javascript 执行类似的操作，并将其用于复选框的 onclick 处理程序。

jsFiddle 链接

function makeMeReadonly(checkbox){
    checkbox.checked = !checkbox.checked;
}

和

<asp:CheckBox id="checkbox1" onclick="makeMeReadonly(this)" />

/或

<asp:CheckBox id="checkbox1" onclick="this.checked = !this.checked" />

如果您希望将其内联。

但您不应该依赖于此来确保安全，因为当 javascript 不可用和/或客户端代码并不难解决客户端代码限制时，它将是一个常规复选框，但在您的情况下，因为您有只读视图，我不会认为你有任何逻辑来保存更改。

Answer 4

我刚刚遇到了同样的问题，并通过复选框上的 OnClick 事件修复了它。在事件处理程序中，.Checked 状态设置为它应该显示的值。

private void chkBox_CheckStateChanged(object sender, EventArgs e)
    {
        chkBox.Checked = boolDatabasevalue;
        return;
    }

效果很好，用户可以单击复选框，但复选标记不会改变。

唯一的问题是指示焦点的轻微边框阴影。但正如OP所寻找的那样，勾号是易于阅读的粗体。

注意：这是 C#，但在 Asp.Net 中应该类似地工作。