Ajax MYSQL搜索和排序结果
Ajax MYSQL搜索和排序结果
提问于 2017-08-19 23:15:54
尝试找出如何添加我的mysql结果的排序选项，这些结果是通过Ajax功能获取的。按mysql列或其他什么进行排序。下面是一些我希望实现排序选项的"th“部分。
HTML页面
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tool details</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<input type="text" name="search_text" id="search_text" placeholder="Search for tool details" class="form-control" />
<div id="result"></div>
<script>
$(document).ready(function(){
load_data();
function load_data(query)
{
$.ajax({
url:"fetch.php",
method:"POST",
data:{query:query},
success:function(data) {
$('#result').html(data);
}
});
}
$('#search_text').keyup(function(){
var search = $(this).val();
if(search != '') {
load_data(search);
} else {
load_data();
}
});
});
</script>
</body>
</html>请注意，目前只为ID列添加排序，以避免此处代码的复杂性。
fetch.php
<?php
//fetch.php
include($_SERVER['DOCUMENT_ROOT'].'/db/connect-db.php');
$output = '';
if(isset($_POST["query"])) {
$search = mysqli_real_escape_string($connection, $_POST["query"]);
$query = "SELECT * FROM tools
WHERE toolsn LIKE '%".$search."%'
OR toolcategory LIKE '%".$search."%'
OR tooldesc LIKE '%".$search."%'
OR toolpn LIKE '%".$search."%'
OR toolstatus LIKE '%".$search."%'";
} else {
$query = "SELECT * FROM tools ORDER BY id";
}
$result = mysqli_query($connection, $query);
//get feedback why database not working
if (!$result) {
printf("Error: %s\n", mysqli_error($connection));
exit();
}
if(mysqli_num_rows($result) > 0) {
$output .= '
<div class="table-responsive">
<table class="table table bordered">
<tr>
<th>Customer Name</th>
<th>Address</th>
<th>City</th>
<th>Postal Code</th>
<th>Country</th>
</tr>';
while($row = mysqli_fetch_array($result)) {
$output .= '<tr>
<td>'.$row["tooldesc"].'</td>
<td>'.$row["toolcategory"].'</td>
<td>'.$row["toolsn"].'</td>
<td>'.$row["toolpn"].'</td>
<td>'.$row["toolstatus"].'</td>
</tr>';
}
echo $output;
}else {
echo 'Data Not Found';
}
?>回答 1
Stack Overflow用户
发布于 2017-08-19 23:35:52
我已经设法用下面的代码重现了排序选项，但这只有在我直接访问fetch.php页面时才有效。当我试图通过我的html页面(通过脚本)获取详细信息时，只显示结果，但没有排序功能(超链接不起作用)，可能是因为下面的代码不能读取两个字符串，因为fetch.php包含在父html页面中。
$query = "SELECT * FROM tools ORDER BY " . $orderBy . " " . $order;因此$orderby和$order不会向$query发出命令，因为它不是直接访问页面。html页中的脚本正在读取fetch.php中的结果。
fetch.php
<?php
//fetch.php
include($_SERVER['DOCUMENT_ROOT'].'/db/connect-db.php');
$orderBy = "id";
$order = "asc";
if(!empty($_GET["orderby"])) {
$orderBy = $_GET["orderby"];
}
if(!empty($_GET["order"])) {
$order = $_GET["order"];
}
$idNextOrder = "asc";
$tooldescNextOrder = "asc";
$toolcategoryNextOrder = "asc";
$toolsnNextOrder = "asc";
$toolpnNextOrder = "asc";
$toolstatusNextOrder = "asc";
if($orderBy == "id" and $order == "asc") {
$idNextOrder = "desc";
}
if($orderBy == "tooldesc" and $order == "asc") {
$tooldescNextOrder = "desc";
}
if($orderBy == "toolcategory" and $order == "asc") {
$toolcategoryNextOrder = "desc";
}
if($orderBy == "toolsn" and $order == "asc") {
$toolsnNextOrder = "desc";
}
if($orderBy == "toolpn" and $order == "asc") {
$toolpnNextOrder = "desc";
}
if($orderBy == "toolstatus" and $order == "asc") {
$toolstatusNextOrder = "desc";
}
$output = '';
if(isset($_POST["query"]))
{
$search = mysqli_real_escape_string($connection, $_POST["query"]);
$query = "
SELECT * FROM tools
WHERE toolsn LIKE '%".$search."%'
OR toolcategory LIKE '%".$search."%'
OR tooldesc LIKE '%".$search."%'
OR toolpn LIKE '%".$search."%'
OR toolstatus LIKE '%".$search."%'
";
}
else
{
//$query = "SELECT * FROM tools";
$query = "SELECT * FROM tools ORDER BY " . $orderBy . " " . $order;
}
$result = mysqli_query($connection, $query);
//get feedback why database not working
if (!$result) {
printf("Error: %s\n", mysqli_error($connection));
exit();
}
if(mysqli_num_rows($result) > 0)
{
$output .= '
<div class="table-responsive">
<table class="table table bordered">
<tr>
<th class="id"><a title="Sort by system ID" href="?orderby=id&order='.$idNextOrder.'">ID</a></th>
<th class="toolsn"><a title="Sort by tool serial number" href="?orderby=toolsn&order='.$toolsnNextOrder.'">Tool SN</a></th>
<th class="toolpn"><a title="Sort by tool part number" href="?orderby=toolpn&order='.$toolpnNextOrder.'">Tool PN</a></th>
<th class="toolcategory"><a title="Sort by tool category" href="?orderby=toolcategory&order='.$toolcategoryNextOrder.'">Tool category</a></th>
<th class="tooldesc"><a title="Sort by tool description" href="?orderby=tooldesc&order='.$tooldescNextOrder.'">Tool description</a></th>
<th class="toolstatus"><a title="Sort by tool status" href="?orderby=toolstatus&order='.$toolstatusNextOrder.'">Tool status</a></th>
<th class="options"></th>
</tr>
';
while($row = mysqli_fetch_array($result))
{
$output .= '
<tr>
<td>'.$row["id"].'</td>
<td>'.$row["toolsn"].'</td>
<td>'.$row["toolpn"].'</td>
<td>'.$row["toolcategory"].'</td>
<td>'.$row["tooldesc"].'</td>
<td>'.$row["toolstatus"].'</td>
<td></td>
</tr>
';
}
echo $output;
}
else
{
echo 'Data Not Found';
}
?>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45773169
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号