我有一个使用HTML5 / PHP / Bootstrap编写的业余体育俱乐部管理系统,并在各个地方使用数据表。
对于管理等待列表的表之一,我需要按最大和最小使用期限来过滤数据库集,因此在以下链接(https://www.datatables.net/examples/plug-ins/range_filtering.html)中使用了数据表提供的代码。
关于表格的所有操作均有效,但更改max和min值无效。
头部具有以下Javascript(从Datatables复制)
$.fn.dataTable.ext.search.push(
function (settings, data, dataIndex) {
var min = parseInt($('#min').val(), 10);
var max = parseInt($('#max').val(), 10);
var age = parseFloat(data[2]) || 0; // use data for the age column
if ((isNaN(min) && isNaN(max)) ||
(isNaN(min) && age <= max) ||
(min <= age && isNaN(max)) ||
(min <= age && age <= max))
{
return true;
}
return false;
}
);
正文部分(html / php)中的表
<table border="0" cellspacing="5" cellpadding="5">
<tr>
<td>Minimum age:</td>
<td><input type="number" id="min" name="min" min="3" max="21"></td>
<td>Maximum age:</td>
<td><input type="number" id="max" name="max" min="3" max="21"></td>
</tr>
</table>
<table id = "table" class = "display compact cell-border stripe" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Gender</th>
<th>Age</th>
<th>Date Added</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
$query = $conn->query("SELECT * FROM `waitlist` WHERE wl_status ='Active'") or die(mysqli_error());
while ($f_query = $query->fetch_array()) {
echo '<tr>';
echo '<td>' . $f_query['wl_Name'] . '</td>';
echo '<td>' . $f_query['wl_Gender'] . '</td>';
echo '<td>' . getAge($f_query['wl_DoB']) . '</td>';
echo '<td data-sort="' . $f_query['wl_DateAdded'] . '">' . date('d/m/Y', strtotime($f_query['wl_DateAdded'])) . '</td>';
echo '<td><center><a href = "wl_edit.php?wl_id=' . $f_query['wl_ID'] . '" class = "btn btn-warning btn-sm"><span class = "fa fa-edit"></span> Details</a>' . ' | <a onclick = "javascript:confirmationDelete($(this)); return false;" href = "wl_delete.php?wl_id=' . $f_query['wl_ID'] . '" class = "btn btn-danger btn-sm"><span class = "fa fa-trash"></span> Delete</a>' . ' | <a href = "wl_transfer.php?wl_id=' . $f_query['wl_ID'] . '" class = "btn btn-primary btn-sm"><span class = "fa fa-paste"></span> To Member</a></center></td>';
echo '</tr>';
};
?>
</tbody>
</table>
页面底部的Javascript包含:
$(document).ready(function () {
$('#table').DataTable({
"lengthChange": false,
"pageLength": 12,
"pagingType": "full_numbers",
"order": [[3, "asc"]]
});
var table = $('#table').DataTable();
$('#min, #max').keyup(function () {
table.draw();
});
});
keyup函数部分是从Datatables链接复制的
getage PHP函数是PHP标头的一部分
function getAge($date) { // Y-m-d format
return intval(substr(date('Ymd') - date('Ymd', strtotime($date)), 0, -4));
我仍在努力使用javascript,并希望这是问题所在,但看不到造成问题的明显原因。谢谢
答案 0 :(得分:0)
问题出在您的getAge()
函数上,如果您查看表中的age列,这应该很明显。您的代码是:
function getAge($date)
{
return intval(substr(date('Ymd') - date('Ymd', strtotime($date)), 0, -4));
}
PHP date()函数返回格式为'YYYMMDD'
的字符串。您有两个,然后减去它们。假设它们分别为'20190414'
和'20020321'
,将它们相减将得到170093
,用substr()
取最后两个字符的年龄为93
出生于2002年。您没有注意到吗?
因此,让我们编写一个更好的getAge()
函数。随着时间的推移准确地工作是困难的。但是,PHP中实际上有一个函数可以计算日期差:
https://www.php.net/manual/en/datetime.diff.php
如果使用它来创建函数,则会得到:
function getAge($dateStr)
{
$birthDate = new DateTime($dateStr); // check the valid formats in the manual!
$currentDate = new DateTime();
return $birthDate->diff($currentDate, true)->y; // return difference in years
}
此函数可以用一行代码编写,而不是用三行代码编写,但这很难阅读,所以不要这样做。
这对您有用吗?您的代码中可能还存在其他错误,调试Javascript错误的一种好方法是查看您的developer tools。
答案 1 :(得分:0)
事实证明,我需要更改添加外部jquery / bootstrap / datatables js脚本的顺序。
感谢您的帮助。