bootstrap 中带有多个复选框的组合框

Question

在 bootstrap 中如何使用带有多个复选框选项的组合框，如附图所示。

我在下拉列表中使用了多个复选框选项，如下所示，但我不希望下拉列表带有复选框，而是希望像附加的图像一样。

<select multiple="multiple"> .... </select>

Answer 1

从下面的方法我得到了解决方案

<table>
                            <tr>
                                <td>
                                    <div
                                        style="max-height: 350px; overflow-y: scroll; width: 375px;background: white;"
                                        class="scrollbar style-2">
                                        <table class="table">
                                            <thead align="center">
                                                <tr>
                                                    <th style="text-align: center;background: #5cb85c;color : white;">List</th>
                                                    <th style="background: white;background: #5cb85c;color : white;"></th>
                                                </tr>
                                            </thead>
                                            <tbody style="background: white;">
                                            <%
                                                for (int i = 0; i < 10; i++) {
                                            %>
                                                <tr style="border: 0">
                                                <td style="border: 0">
                                                    <div class="[ form-group ]">
                                                        <input type="checkbox" name="fancy-checkbox-default_p3_ii<%=i%>"
                                                            id="fancy-checkbox-default_p3_ii<%=i%>" autocomplete="off" />
                                                        <div class="[ btn-group ]">
                                                            <label for="fancy-checkbox-default_p3_ii<%=i%>"
                                                                class="[ btn btn-success ]" style="top: 5px;"> <span
                                                                class="[ glyphicon glyphicon-ok ]"></span> <span> </span>
                                                            </label> <label for="fancy-checkbox-default_p3_ii<%=i%>"
                                                                class="[ btnCustom active ]"> Default Checkbox<%=i%>
                                                            </label>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>
                                            <%
                                                }
                                            %>
                                            </tbody>
                                        </table>
                                    </div>
                                </td>
                            </tr>
                        </table>