将引导复选框设置为不带btn组的按钮

Question

我试图从我的数据库中获取一个项目列表，其中每个列出的项目都与引导警报样式中的“删除”可选按钮配对。当用户使用页面底部的“delete selected”（删除选定项）按钮提交时，所有选定的条目都将从数据库中删除。

现在，Bootstrap的文档只解释了如何将复选框样式设置为btn组中的按钮，这将它们全部组合在一行中。我正在处理一个列表，所以我不希望复选框按钮在一个组中：我每行都需要它们，并且与它们要删除的条目的标签明确关联。但是，如果没有btn group div，我似乎无法将复选框设置为按钮。这似乎是相当随意的，我想知道在引导样式中是否有一种简单的方法可以做到这一点，而不必手动编写大量javascript onclick事件来使用常规的引导按钮类型，而不必使用复选框。

这是我现在所拥有的，我只是将每个复选框单独放在它自己的小btn组中，但它设置了所有奇怪的格式，并默认自动选择按钮：

@foreach ($data['entries'] as $entry) <!-- blade template stuff -->
            <div class="btn-group" data-toggle="buttons">
                    Label of the database entry
                    <label class="btn btn-danger active">
                        <input type="checkbox" autocomplete="off"> Delete
                    </label>
            </div>
            </br>
            </br>
@endforeach

在Bootstrap中是否有一个好的方法来做到这一点，或者我自己用js编写它？




Answer 1

@foreach ($data['entries'] as $entry) <!-- blade template stuff -->
  <div data-toggle="buttons">
    Label of the database entry

    <label class="btn btn-danger">
      <input type="checkbox" autocomplete="off"> Delete
    </label>
  </div>
@endforeach

这应该是可行的，只需删除btn组类即可