Php 如何从mysql数据库中过滤搜索数据并在datatable中显示?
我使用datatable来显示数据。我有将近15k行的大型数据库,加载数据需要时间,所以我在datatable中只显示200行。但是数据表中的搜索过滤器是这里需要的最重要的东西。因此,我需要通过ajax调用keyup事件,通过php直接从数据库中搜索数据。那我该怎么做呢 这就是我到现在为止所做的Php 如何从mysql数据库中过滤搜索数据并在datatable中显示?,php,jquery,json,ajax,mysqli,Php,Jquery,Json,Ajax,Mysqli,我使用datatable来显示数据。我有将近15k行的大型数据库,加载数据需要时间,所以我在datatable中只显示200行。但是数据表中的搜索过滤器是这里需要的最重要的东西。因此,我需要通过ajax调用keyup事件,通过php直接从数据库中搜索数据。那我该怎么做呢 这就是我到现在为止所做的 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8">
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Trail 2</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="datatable/css/jquery.dataTables.min.css" rel="stylesheet">
<!--<link href="https://cdn.datatables.net/1.10.15/css/dataTables.bootstrap.min.css" rel="stylesheet">-->
<style>
tfoot input {
width: 100%;
padding: 3px;
box-sizing: border-box;
}
</style>
</head>
<body>
<br><br>
<div class="container">
<div class="row">
<table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Surname</th>
<th>City</th>
<th>Mobile No</th>
</tr>
</thead>
<tfoot>
<tr>
<th><input type="text" name="name" id="name" placeholder="Search by NAME"></th>
<th>Surname</th>
<th>City</th>
<th>Mobile No</th>
</tr>
</tfoot>
<tbody>
<?php
require('connectivity2.php');
$query1 = "SELECT * FROM member LIMIT 200;";
$result1 = mysqli_query($con, $query1);
while($row = mysqli_fetch_assoc($result1)){
$name = $row['m_name'];
$surname = $row['m_sec_surname'];
$city = $row['m_city'];
$no = $row['m_mobile'];
?>
<tr>
<td><?php echo $name; ?></td>
<td><?php echo $surname; ?></td>
<td><?php echo $city; ?></td>
<td><?php echo $no; ?></td>
</tr>
<?php } //End of while loop
?>
</tbody>
</table>
</div>
</div>
<script src="js/jquery-1.12.4.js"></script>
<script src="datatable/js/jquery.dataTables.min.js"></script>
<!--<script src="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap.min.js"></script> -->
<script type="text/javascript">
$(document).ready(function() {
// DataTable
var table = $('#example').DataTable();
// Search
$("#name").keyup(function(){
var m_name = $("input[name='name']").val();
//window.alert(m_name);
$.ajax({
type: 'POST',
url: 'trial2php.php',
data: {member name:m_name},
cache: true,
datatype: 'html',
success: function(){
$('#example').DataTable();
}
});
});
} );
</script>
</body>
</html>
线索2
tfoot输入{
宽度:100%;
填充:3倍;
框大小:边框框;
}
名称
姓
城市
手机号码
姓
城市
手机号码
$(文档).ready(函数(){
//数据表
变量表=$(“#示例”).DataTable();
//搜寻
$(“#名称”).keyup(函数(){
var m_name=$(“输入[name='name']”)val();
//窗口警报(m_名称);
$.ajax({
键入:“POST”,
url:'trial2ppp.php',
数据:{成员名称:m_name},
是的,
数据类型:“html”,
成功:函数(){
$(“#示例”).DataTable();
}
});
});
} );
在这里,我只在表的页脚中输入了一个文本,用于测试搜索
ajax函数中出现了一些错误。请帮帮我 仅选择所需的列:
SELECT ItemCode, ItemName, RackNo, ItemSrNo
ItemCode, ItemName, RackNo, ItemSrNo
为列创建索引:
SELECT ItemCode, ItemName, RackNo, ItemSrNo
ItemCode, ItemName, RackNo, ItemSrNo
见:
您应该使用带有数据表管道功能的服务器端处理。通过这种方式,数据表中的数据的获取、呈现和过滤将变得更加平滑
通过下面的链接了解更多有关流程的示例-
使用jQuery/AJAX并不是影响查询运行时间的灵丹妙药。您需要做的是将数据分解成块,这些块可以以可管理的大小批量提供给UI,例如,每个请求100条记录。要做到这一点,使用分页、过滤或两者的组合不将所有内容打印到表中,这也会占用浏览器的内存。按照建议直接使用Ajax查询数据库,并使用
LIMIT
语句更新表。Ajax只不过是一个由JS启动的PHP文件的帖子,用这些值查询数据库,用javascript解析echo'd值并将其放在需要的地方。因为您使用的是datatables,所以不应该一次获取所有15k记录。您应该使用“limit”并添加数据表附带的分页。这会更快,实施起来也会更快。Ajax或JQuery不会影响MySQL的速度。它完全不相关。首先,丢失这个$query1=“SELECT*FROM itemtable;”代码>选择您需要的好的,现在我将数据限制为datatable中的200行。但我希望搜索过滤器从mysql表中搜索数据,并在同一个datatable上显示结果。你能告诉我如何在没有加载的情况下用新结果刷新数据表吗?在keydown@XorifelseOh,wouw上,我的数据库中有370万行。这是我一直在等待的神奇子弹吗?那么你真的应该使用15000;我的Galaxy S3不会因为显示15k行数据的内存不足而崩溃?万一你没听清楚我的第一句话,那是讽刺的意思。这不是做事的方式,永远不需要显示15k的结果。甚至不是1k、500甚至250。也许50或100使用分页。@Xorifelse是一个很好的答案,但如果有需要,那么解决方案是什么呢?因为有人在interviewsimple中提出了问题,您的keyup
事件应该使用js$将数据发布到PHP脚本中。post
并使用该值以“%%wildcard%”值查询您的“title”
列,使用LIMIT
可以在中回显数据并使用新值更新表。基本ajax示例。但是我很确定DataTables也有一个简化的特性,但是我对DataTables不是很了解,所以我建议您搜索他们的API。