如何使用jquery-jtable将复选框设置为只读显示状态？

问题原因 #

jTable 的 checkbox 类型列默认在edit: false状态下不会渲染原生复选框组件，只会渲染values配置项中布尔值对应的文本内容，你当前配置的values中true和false对应的取值都是空字符串，因此单元格会显示为空。

方案1：自定义单元格渲染（更灵活，推荐） #

通过display配置项自定义渲染禁用复选框，不依赖jTable默认的checkbox类型逻辑：

Returned: {
    title: 'Returned',
    width: '7%',
    sorting: false,
    display: function (data) {
        // 根据字段值动态控制选中状态，disabled属性实现只读
        return `<input type="checkbox" ${data.record.Returned ? 'checked' : ''} disabled />`;
    }
}

方案2：修改values配置（改动最小） #

如果要保留原有的checkbox类型配置，直接修改values配置的取值为禁用复选框的HTML内容即可：

Returned: {
    title: 'Returned',
    width: '7%',
    sorting: false,
    type: 'checkbox',
    edit: false,
    values: { 
        'true': '<input type="checkbox" checked disabled />', 
        'false': '<input type="checkbox" disabled />'
    }
}

注：如果你的Returned字段是原生布尔类型而非字符串类型，将values的键去掉引号改为true/false即可适配。

内容的提问来源于stack exchange，提问作者UW_Huskies_01