我在用引导表 http://bootstrap-table.wenzhixin.net.cn/documentation/我正在尝试设置复选框，问题是复选框在没有特殊原因的情况下被启动为选中状态
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="robots" content="noindex, nofollow">
<meta name="googlebot" content="noindex, nofollow">
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.0.js"></script>
<script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.css">
<script type="text/javascript" src="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.js"></script>
<title>Bootstrap Table</title>
</head>
<body>
<div class="container">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="panel panel-primary">
<div class="panel-heading">why checked?</div>
<div class="panel-body">
<table data-row-style="rowStyle" data-toggle="table" data-click-to-select="true">
<thead>
<th data-field="dd" data-checkbox="true">
</th>
<th data-sortable="true">
x
</th>
<th data-sortable="true">
y
</th>
<th data-sortable="true">
z
</th>
<th data-sortable="true">
t
</th>
<th data-sortable="true">
r
</th>
<th data-sortable="true">
m
</th>
<th></th>
</thead>
<tbody>
<tr>
<td>
</td>
<td> 1</td>
<td>2</td>
<td>3</td>
<td> 4</td>
<td> 5</td>
<td><span class="label label-default">xxx</span></td>
<td>
<div class="form-inline text-right">
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}/edit" method="post">
<button class="btn btn-primary btn-xs"><i class="glyphicon glyphicon-pencil"></i></button>
</form>
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}" method="post">
<input name="_method" type="hidden" value="DELETE">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<button class="btn btn-warning btn-xs"><i class="glyphicon glyphicon-remove"></i></button>
</form>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
demo:http://jsfiddle.net/e3nk137y/12160/ http://jsfiddle.net/e3nk137y/12160/
第二个问题，如何向复选框添加名称和值，我尝试从data-formatter功能，但在开发工具中没有看到任何改变
该文档没有提及自定义复选框的任何属性/功能/事件
Update似乎如果您想对所选元素进行排序，第一列（复选框列）就会消失
当引导表在表格单元格中发现空白字符时，看到引导表崩溃实际上是很有趣的。一旦它们被修剪掉包括换行符在内的任何空白字符，问题似乎就会自行解决。
function check() {
$("tbody input:checked").each(function() {
console.log($(this).parents("tr:first").data("val"));
});
}
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.0.js"></script>
<script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.css">
<script type="text/javascript" src="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.js"></script>
<div class="container">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="panel panel-primary">
<div class="panel-heading">why checked?</div>
<div class="panel-body">
<button onclick="check()">Check Values</button>
<table data-row-style="rowStyle" data-toggle="table" data-click-to-select="true">
<thead>
<th data-field="dd" data-checkbox="true">
</th>
<th data-sortable="true">
x
</th>
<th data-sortable="true">
y
</th>
<th data-sortable="true">
z
</th>
<th data-sortable="true">
t
</th>
<th data-sortable="true">
r
</th>
<th data-sortable="true">
m
</th>
<th></th>
</thead>
<tbody>
<tr data-val="100">
<td></td>
<td>100</td>
<td>200</td>
<td>300</td>
<td>400</td>
<td>500</td>
<td><span class="label label-default">xxx</span></td>
<td>
<div class="form-inline text-right">
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}/edit" method="post">
<button class="btn btn-primary btn-xs"><i class="glyphicon glyphicon-pencil"></i></button>
</form>
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}" method="post">
<input name="_method" type="hidden" value="DELETE">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<button class="btn btn-warning btn-xs"><i class="glyphicon glyphicon-remove"></i></button>
</form>
</div>
</td>
</tr>
<tr data-val="200">
<td></td>
<td>200</td>
<td>200</td>
<td>300</td>
<td>400</td>
<td>500</td>
<td><span class="label label-default">xxx</span></td>
<td>
<div class="form-inline text-right">
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}/edit" method="post">
<button class="btn btn-primary btn-xs"><i class="glyphicon glyphicon-pencil"></i></button>
</form>
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}" method="post">
<input name="_method" type="hidden" value="DELETE">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<button class="btn btn-warning btn-xs"><i class="glyphicon glyphicon-remove"></i></button>
</form>
</div>
</td>
</tr>
<tr data-val="300">
<td></td>
<td>300</td>
<td>200</td>
<td>300</td>
<td>400</td>
<td>500</td>
<td><span class="label label-default">xxx</span></td>
<td>
<div class="form-inline text-right">
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}/edit" method="post">
<button class="btn btn-primary btn-xs"><i class="glyphicon glyphicon-pencil"></i></button>
</form>
<form class="form-group" action="{{url('invobj')}}/{{$obj->id}}" method="post">
<input name="_method" type="hidden" value="DELETE">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<button class="btn btn-warning btn-xs"><i class="glyphicon glyphicon-remove"></i></button>
</form>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
我在每一行和函数中添加了 data-valcheck()将记录所选行的值。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
