Question

我想创建一个包含多列的表单组行，然后分别折叠每列，但是根据模板，“ div class =“ collapse”必须位于“ div class =” form group row“上方，阻止我将标记单独的列折叠起来。编辑：一个按钮不能折叠两个单独的元素（1.标签2.input）。下面的代码仅显示如何使用两个按钮完成操作。有没有一种更简单的方法，以便一个按钮实际上可以折叠标签和输入？

  <div class="form-group row">
<label for="Payment1" class="col-sm-1 col-form-label">Payments:</label>
  <div class="col-sm-3">
    <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample1" role="button" aria-expanded="false" aria-controls="collapseExample1">
      Payment 1
    </a>     

    <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample2" role="button" aria-expanded="false" aria-controls="collapseExample2">
      Payment 2
    </a>

  </div>

付款1：

https://jsfiddle.net/Dexter666/4ydq0upk/

Answer 1

请参考我的修正案以解决您的情况：

https://jsfiddle.net/4ydq0upk/23/

u应该将data-parent添加到每个折叠列中，并在data-parent中与parent进行四舍五入。请参阅引导程序文档以获取更多详细信息：

https://getbootstrap.com/docs/4.0/components/collapse/

折叠表格组

1 个答案: