个人中心
gpt4 book ai didi

php - 如何使用 Ajax Json PHP 和 MySQL 应用排序和过滤

转载 作者：行者123 更新时间：2023-12-02 19:38:51 25 4
gpt4 key购买 nike

嗨，我是一名初学者，我正在软件网站上工作。我已经为网站构建了所有页面和布局，这是仅使用 HTML CSS 和 JAVASCRIPT 即可完成的简单部分，唯一剩下的就是为不同的软件制作主类别页面，这对我来说很困难。

我想在类别页面上添加排序选项，如下所示(See Here)用户应能够根据日期、名称、添加日期等对软件进行排序。并且还能够控制显示的最大软件数量，例如 20、30、100 等。

在我的 HTML 页面上，我有这些 div，我想在其中显示数据(不同的软件)来自MySQL数据库“security_software”(它是一个测试数据库) 来自表“internet_security”(它是一个测试表)

HTML Div

  <div class="category-container">
    <div class="category-image"></div>
    <div class="category-desc"><a href="#">#</a><p>text</p></div>
    <div class="rating5" >Editors' rating: </div>
    <div class="category-download-btn"><a href="#">Download</a></div>
    <div class="category-buy-btn"><a href="#">Buy</a></div>
  </div>

经过一些研究，我得到了使用 JSON AJAX PHP 和 MySQL 的解决方案

我有 JAVASCRIPT 代码

<head>    
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$.ajax({
    url: 'ajax.php',
    dataType: 'json',
    success: function(response){
        data = '';
        $.each(response,function(i,val){
          data = '<div class="category-image">'+val.image+'</div>'+
        '<div class="category-link"><a href="#">'+val.id+'</a></div>'+
        '<div class="category-desc"><p>'+val.description+'</p> </div>'+
        '<div class="rating5" >'+val.rating+'</div>'+ 
        '<div class="category-download-btn"><a href="'+val.download+'">Download</a></div>'+ 
        '<div class="category-buy-btn"><a href="'+val.buy+'">Buy</a></div>';
        $('<div>').attr('id',i).html(data).appendTo('#response');
    });

    }
 });
</script>
</head>
 <body>
<div id='response'></div>   
 </body>

我有 PHP 代码

<?php
$q=$_GET["q"]; 

$con = mysql_connect('localhost', 'root', '');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("security_software", $con);

$sql="SELECT * FROM internet_security ORDER by `".$q."` DESC" ;


$result = mysql_query($sql);
$response = array();
$i=0;
while($row = mysql_fetch_array($result))
  {
  $response[$i]['id']           =$row['id'];
  $response[$i]['title']        = $row['title'];
  $response[$i]['image']        = $row['image'];
  $response[$i]['description']  = $row['description'];
  $response[$i]['rating']       = $row['rating'];
  $response[$i]['download']     = $row['download'];  
  $response[$i]['buy']          = $row['buy'];
  $i++;
  }
mysql_close($con); 

echo json_encode($response);
?>

现在它根本不起作用，因为我没有任何地方可以在我的 JavaScript 中附加这些代码(类别下拉)。

<form>
<select name="users" onchange="showUser(this.value)">
<option value="">Select a person:</option>
<option value="id">id</option>
<option value="title">title</option>
<option value="image">image</option>
<option value="description">description</option>
<option value="description">rating</option>
<option value="download">download</option>
<option value="buy">buy</option>
</select>
</form>

请帮助我，我可以在哪里附加这些代码以及如何让它工作，我完全困惑了。

最佳答案

首先值得注意的是，如果您要显示表格数据......请使用表格!这会让你的事情变得更加容易。

其次。构建您的代码和表，就像 Ajax 不存在一样。最初使用 PHP 在显示数据的页面上填充数据。然后，连接列标题，以便它们链接到您的页面，但传递您要排序的列以及方向。

即

<?
    $column = (isset($_GET["column"]) ? $_GET["column"] : 'id'); 
    $direction = (isset($_GET['direction']) ? $_GET['direction'] : 'asc');
    $con = mysql_connect('localhost', 'root', '');
    if (!$con)
    {
        die('Could not connect: ' . mysql_error());
    }

    mysql_select_db("security_software", $con);
    $sql="SELECT * FROM internet_security ORDER by '".$column."' " . $direction;


    $result = mysql_query($sql);
    $response = array();
    $i=0;
    while($row = mysql_fetch_array($result))
    {
        $response[$i]['id']           =$row['id'];
        $response[$i]['title']        = $row['title'];
        $response[$i]['image']        = $row['image'];
        $response[$i]['description']  = $row['description'];
        $response[$i]['rating']       = $row['rating'];
        $response[$i]['download']     = $row['download'];  
        $response[$i]['buy']          = $row['buy'];
        $i++;
    }
    mysql_close($con); 
?>

<div id="content">
    <table>
        <thead>
            <tr>
                <td><a href="table.php?column=id<?= (isset($_GET['column']) && $_GET['column'] == 'id' && !isset($_GET['direction']) ? '&direction=desc' : ''); ?>">ID</a></td>
                <td><a href="table.php?column=title<?= (isset($_GET['column']) && $_GET['column'] == 'title' && !isset($_GET['direction']) ? '&direction=desc' : ''); ?>">Title</a></td>
                <td><a href="table.php?column=rating<?= (isset($_GET['column']) && $_GET['column'] == 'rating' && !isset($_GET['direction']) ? '&direction=desc' : ''); ?>">Rating</a></td>
                <td><a href="table.php?column=download<?= (isset($_GET['column']) && $_GET['column'] == 'download' && !isset($_GET['direction']) ? '&direction=desc' : ''); ?>">Download</a></td>
            </tr>
        </thead>
        <tbody>
            <? foreach($response as $i => $row) : ?>
            <tr>
                <td><?= $row['id']; ?></td>
                <td><?= $row['title']; ?></td>
                <td><?= $row['rating']; ?></td>
                <td><?= $row['download']; ?></td>
            </tr>
            <? endforeach; ?>
        </tbody>
    </table>
</div>

上面的代码将进入单个 PHP 文件，没有任何其他 HTML 等。然后，在您想要显示此表的页面上，您只需 <? include('path-to-file.php'); ?>包括它。

最后...在显示表格的页面顶部，您可以放置​​:

<?
    if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest')
    {
        include('path-to-file.php');
        die();
    }
?>

然后，上面的代码将检测 Ajax 请求，并仅按新顺序提供包含数据的表。

然后，您需要使用 Javascript 通过以下方式将表格替换为新的 HTML

$('#content table thead a').live('click', function(e)
{
    e.preventDefault();
    $.ajax(
    {
        url : $(this).attr('href'),
        success : function(resp)
        {
            $('#content').html($(resp).html());
        },
        error : function()
        {
            alert('There was a problem sorting your table...');
        }
    });
});

哪里resp是包含 Ajax 响应的变量。

注意:这只是一种非常简单粗暴(哦，未经测试)的处理情况的方法。您需要自行改进它以防止任何与安全相关的问题，例如 SQL 注入(inject)。

关于php - 如何使用 Ajax Json PHP 和 MySQL 应用排序和过滤，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10651387/

25 4 0
文章推荐： php - 在php中弹出同一应用程序的另一个用户
文章推荐： c# - 使用 SOAP、Javascript、C#、Webservices、jQuery 的 Windows Gadget for Sharepoint 2007 列表
文章推荐： javascript - 如何在Extjs4中使用负载监听器
文章推荐： JavaScript 变量 not 在 IE9 中未定义
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com