将按钮组与表单结合起来-Bootstrap 3
Combine button group with forms - Bootstrap 3
我正在尝试使用Bootstrap 3和Laravel 5.2将2个表单和页面重定向合并到按钮组中。
我无法使按钮正确格式化,主要是因为其中两个按钮被"form"元素包装。
我的HTML如下:
<div class="btn-group pull-left">
<a class="btn btn-primary btn-sm" href="{!! route('client.create') !!}">
<i class="ion-plus"></i> New
</a>
{!! Form::open(['route' => 'client.allVisible', 'method' => 'post']) !!}
<input name="visibility" class="hidden" value="true">
<button type="submit" class="btn btn-primary btn-sm">
<i class="ion-ios-eye"></i> Visible
</button>
{!! Form::close() !!}
{!! Form::open(['route' => 'client.allVisible', 'method' => 'post']) !!}
<input name="visibility" class="hidden" value="false">
<button type="submit" class="btn btn-primary btn-sm">
<i class="ion-ios-locked"></i> Hidden
</button>
{!! Form::close() !!}
</div>
如果不使用jQuery,这可能吗?谢谢
下面的链接有一个适用于的工作解决方案
如何在引导中对不同形式标签的按钮进行分组
创建多个BTN表单组
http://jsfiddle.net/isherwood/TRjEp/
<br />
<form class="btn-group">
<button class="btn">Button One</button>
<input type="hidden" class="btn" />
</form>
<form class="btn-group inline">
<input type="hidden" class="btn" />
<button class="btn">Button Two</button>
</form>
<form class="btn-group inline">
<input type="hidden" class="btn" />
<button class="btn">Button Three</button>
</form>
附加CSS:
.btn-group+.btn-group {
margin-left: -5px;
}
该代码似乎可以使用HIDDEN Btn,不确定原因。
我不知道如何编码,但这在datatables列中对我有效:
<div class="btn-group btn-group-sm">
<?php echo form_open('edit_files', 'class="btn-group"');?>
<button type="submit" class="btn btn-primary" name="id">Edit</button>
</form>
<?php echo form_open('view_files', 'class="btn-group"');?>
<button type="submit" class="btn btn-success" name="id">View</button>
</form>
相关文章:
- 如何在Bootstrap Modal中为动态点击生成的变量设置jade属性
- 浮动页脚栏-使用Bootstrap隐藏
- Twitter Bootstrap typeahead:使用“this”获取上下文/调用元素
- 创建带有和不带有JavaScript的Bootstrap下拉菜单
- AngularJS/HTML/Bootstrap元素用于动态搜索结果
- Steam Web API:I'我不知道该如何处理这个看起来像哈希的url来生成图像
- Javascript+Bootstrap图像库未加载
- Bootstrap Dropdown selection是在*all*下拉菜单上设置选择
- Bootstrap 3 Datepicker v4:dp.show和dp.change事件在Datepicker内联时不
- Bootstrap-三列相等;t更改'a'要素
- 在bootstrap中显示隐藏特定的li
- 如何使删除线看起来像x
- 为什么引导程序下拉菜单只有在包含bootstrap-responsive.css时才起作用
- Twitter Bootstrap 2.1.0子菜单在Responsive上看起来很混乱
- Bootstrap折叠按钮不适用于android
- bootstrap消除模态并显示另一个模态
- Bootstrap下拉菜单不起作用
- 用javascript创建一个看起来正常分布的模式
- Bootstrap粘贴Nav使下面的Div跳起来
- 将按钮组与表单结合起来-Bootstrap 3