如何解决字段为空时的复选框过滤器表
我有一张带有订单的表格,其中一列是“跟踪编号” 添加了一个复选框,以便用户可以选择何时查看所有订单或仅查看不带编号的订单。 这是视图中的复选框:
<div id="TrackingNumber">
<input type="checkbox" name="pos" value=true/>Show All
</div>
调用的javascript是:
<script>
$(document).ready(function () {
$.fn.dataTable.ext.search.push(
function (settings,searchData,index,rowData,counter) {
var positions = $('input:checkbox[name="pos"]:checked').map(function () {
return this.value;
}).get();
if (positions.length === 0) {
return true;
}
if (positions.indexOf(searchData[1]) !== -1) {
return true;
}
return false;
}
)
var table = $('#tblData').DataTable();
$('input:checkbox').on('change',function () {
table.draw();
});
});</script>
选中该复选框时,它显示0条记录,而未选中时,它显示所有记录。 我希望它在选中复选框时显示所有记录,并且仅显示没有跟踪编号的记录 取消选中时 帮助将不胜感激:)
解决方法
这是一个演示:
查看:
<table id="tblList" class="table table-striped table-bordered" style="width:100%">
<div>
<input type="checkbox" id="pos" checked="checked"/>Show All
</div>
<thead class="thead-dark">
<tr class="table-info">
<th>pal</th>
<th>via</th>
<th>con</th>
<th>TrackingNumber</th>
</tr>
</thead>
</table>
@section scripts{
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.js"></script>
<script type="text/javascript">
$(function () {
var url = "GetAllPakingList";
LoadPack(url);
})
function LoadPack(url) {
$('#tblList').DataTable({
destroy: true,ajax: {
url: url,},columns: [
{ "data": "pal",responsivePriority: 1,"searchable": true },{ "data": "via",responsivePriority: 2,{ "data": "con",responsivePriority: 3,{ "data": "trackingNumber",responsivePriority: 4,],});
};
$.fn.dataTable.ext.search.push(
function (settings,data,dataIndex) {
var trackingNumber = data[3];
if ($('#pos').prop("checked") != true && trackingNumber!="") {
return false;
} else {
return true;
}
}
);
$('input:checkbox').on('change',function () {
var table = $('#tblList').DataTable();
table.draw();
});
</script>
}
ListOutput:
public class ListOutput
{
public string pal { get; set; }
public string via { get; set; }
public string con { get; set; }
public string TrackingNumber { get; set; }
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。