Question

我正在使用bootstrap表并且有一列复选框类型。

 $('#table').bootstrapTable({
    columns: [{
        field: 'GroupId',
        title: 'Group ID'
    }, {
        field: 'IsActive',
        title: 'Active',
        checkbox: true
    }]
});

当我使用'checkbox：true'时，该列附带复选框图标，包括标题。我可以保留行中的复选框图标，但标题是标题吗？

Answer 1

        <table class="table table-bordered" id="testbedsTable"
               data-pagination="true"
               data-search="true"
               data-checkbox-header="false">
            <thead>
                <tr>
                    <th scope="col" data-field="State" data-checkbox="true" id="tableDefaultCheck" data-show-select-title="true">Validate</th>

data-checkbox-header =“ false” 和 data-show-select-title =“ true”>验证解决了我的问题

Answer 2

我运行了一个这样的样本，当我将它调整到我已经拥有的样本时，我能够使它工作。我怀疑它是否正确填充了复选框，但我并不关心尝试使其工作。 http://www.codeply.com/go/h7PZLLTY0b

{
            field: 'price',
            title: 'Item Price',
            checkbox: true
}

Answer 3

您必须添加两个配置：

首先在表格选项中禁用默认复选框标题添加：

checkboxHeader: false

启用复选框标题并在列选项中设置自定义标题，添加：

checkbox: true,
showSelectTitle: true,
field: 'IsActive',
title: 'Active'

在您的示例中：

 $('#table').bootstrapTable({
    checkboxHeader: false,
    columns: [{
        field: 'GroupId',
        title: 'Group ID'
    }, {
        checkbox: true,
        showSelectTitle: true,
        field: 'IsActive',
        title: 'Active'
    }]
});

Answer 4

{
    field: 'ActionField',
    title: '',
    sortable: false,
    width: '25',
    halign: "center",
    formatter: "CheckBoxFormat",
    checkbox: false,
    clickToSelect: true,
},


function CheckBoxFormat(value, row) {
    return '<input type="checkbox" class="chk" data-ID="' + row.ID + '" onclick="AddRemoveItems(this);"/>';
}

如何在Bootstrap表中为复选框列添加标题

4 个答案: