好吧，我搜索了每个网站，但没有找到我想要的东西，所以: 我会更容易让你看到我有什么: my page ;)
因此，对于每个单选按钮，我想设置表格的显示。
例如:如果我选择“Alphabétique”，则值按字母顺序排序。
我知道我需要使用 Ajax，但我对此绝对不满意。除此之外，我还在 MVC 中对我的项目进行编程。 我对 Google、Stack、OpenClassroom 等进行了一些研究。 我不明白我需要在 Ajax 中做什么或者需要在哪里添加指令。 这是我的代码:
controllerBoutique.php( Controller ):
<?php
require('../Views/codes/boutique.php');
require('../Models/vehicule.php');
$query = getVehiculesByAlpha();
require('../Views/codes/tabAffich.php');
?>
boutique.php:(查看)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Rentcar - Boutique</title>
<link rel="stylesheet" href="../Views/styles/style2.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script>
</head>
<body>
<?php require("menu.php");?>
<section id="section" class="main-section cleanbg">
<div class="container">
<label>Trier par :</label>
<div class="single-col">
<div class="styled-input-container">
<div class="styled-input-single">
<input type="radio" name="fieldset-1" id="radioAlpha" value="Alpha" checked="checked"/>
<label for="radioAlpha">Alphabétique</label>
</div>
<div class="styled-input-single">
<input type="radio" name="fieldset-1" id="radioModel" value ="Model"/>
<label for="radioModel">Modèle</label>
</div>
<div class="styled-input-single">
<input type="radio" name="fieldset-1" id="radioKm" value ="Km"/>
<label for="radioKm">Kilométrage</label>
</div>
<div class="styled-input-single">
<input type="radio" name="fieldset-1" id="radioDispo" value ="Dispo"/>
<label for ="radioDispo"> Disponible </label>
</div>
</div>
</div>
</div>
<div class="search">
<label class="lblSearch"> Rechercher :</label>
<input type="text" id="search-box" class="search-box">
<button class="btnSearch">Chercher</button>
</div>
</section>
<section id="section" class="main-section cleanbg">
<div class="container">
<hr>
tabAffich.php:(查看表)
<div class="wrapper">
<div class="table">
<div class="row header">
<div class = "cell">Marque</div>
<div class = "cell">Modèle</div>
<div class= "cell">Kilométrage</div>
</div>
<?php
while($res = $query->fetch()){
?>
<div class="row">
<div class ="cell">
<?php echo $res['nom'];?>
</div>
<div class="cell">
<?php echo $res['modele'];?>
</div>
<div class="cell">
<?php echo $res['km'];?>
</div>
</div>
<?php
}
$query->closeCursor();
?>
</div>
</div>
</div>
</section>
</body>
</html>
vehicule.php(模型):
<?php
function getVehiculesByAlpha(){
try{
$db = new PDO('mysql:host=localhost;dbname=ProjectRentcar;charset=utf8','root','root');
}catch(Exception $e){
die('Erreur : '.$e->getMessage());
}
$query = $db->query('
SELECT nom, modele, km
FROM Vehicule V, Marque Ma
WHERE V.numMarque = Ma.numMarque
ORDER BY nom, modele');
return $query;
}
function getVehiculesByModel(){
//Same code with order differently
}
function getVehiculesByKm(){
//Same here
}
所以我想知道当我单击特定的单选按钮时如何更改表格的显示，以及 Ajax 中的一些帮助😉 预先感谢您❤️
最佳答案
您可以仅使用 PHP 来实现此目的，但对于用户体验来说，使用 Ajax 实现此目的肯定会更好(对于您来说，您也会了解更多)。
1) 因此，首先您需要一个 javascript 函数，当您单击 input[type=radio] 时会触发该函数。例如，如果您单击带有 id == radioAlpha 的单选按钮它将使用 Ajax 请求运行一个函数到您的 vehicule.php?sort=alphabetique 。如果您单击带有 id == radioModel 的单选按钮它应该使用 Ajax 请求运行一个函数到您的 vehicule.php?sort=model - 您可以使用 Ajax 使用 POST 或 GET 请求发送数据，您喜欢如何。
2) 然后您应该更改您的 vehicule.php文件，它还应该包含这样的内容:
if ($_GET['sort'] == 'alphabetique') {
// run function with sort for alphabetique
// echo data with json format for example or even with html
}
if ($_GET['sort'] == 'models') {
// run function with sort for model
// echo data with json format for example or even with html
}
...
...
3) 您的文件 tabAffich.php
<?php
while($res = $query->fetch()){
?>
<div id="sorttable"> // Add this line
<div class="row">
<div class ="cell">
<?php echo $res['nom'];?>
</div>
<div class="cell">
<?php echo $res['modele'];?>
</div>
<div class="cell">
<?php echo $res['km'];?>
</div>
</div>
<?php
}
$query->closeCursor();
?>
</div>
回到Ajax请求，当它成功调用并响应时，您可以在<div id="sorttable">中生成新数据容器。您需要一些关于 javascript 的知识，如何清除数据并从 ajax 响应生成新的响应，但它并不难学。
我希望这能帮助您理解如何在这种情况下使用 ajax。
确实有很多方法可以达到您想要达到的效果，我认为我介绍的方法非常简单。
关于javascript - 使用单选按钮 mvc 设置我的表格的显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48141231/