php - 从 html select 更新 mysqli 查询

Question

我有一个tests.php网页，它使用在线服务器上的mysql数据库中的数据成功创建并填充了一个html表。接下来我想通过添加 html select 来限制 sql 查询返回的行数，从而使网页具有交互性。我添加了 html 选择代码并修改了我的 sql 查询以使用 LIMIT 变量。我遇到的问题是如何在选择下拉列表更改时运行查询。我假设需要调用某种页面刷新，但不确定如何进行此操作。例如，我是否需要将 html 作为 from 括起来，并有一个提交按钮才能完成这项工作？这不是我想要的，理想情况下用户按下 html select，然后页面刷新或重新运行 sql 数据库查询。

请客气，这是我编写的第一个 PHP 代码。

我选择的代码

<select name="limit" id="limit">
    <option value="10">10</option>
    <option value="25">25</option>
    <option value="50">50</option>
    <option value="100">100</option>
</select>  

PHP代码

</body>
</html>
<?php
$limit = 10;
if(isset($_POST["limit"])) $limit = $_POST["limit"];


$con=mysqli_connect("localhost","user","password","database");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$result = mysqli_query($con,"SELECT * FROM TableName WHERE Region='Home' ORDER BY TeamName ASC LIMIT $limit");

echo "<table class='sample' style='width:50%'>
<tr>
<th>Team Name</th>
<th># Players</th>
<th>Venue</th>
<th>Date</th>
<th>Score</th>
</tr>";

while($row = mysqli_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['TeamName'] . "</td>";
echo "<td>" . $row['NumPlayers'] . "</td>";
echo "<td>" . $row['Venue'] . "</td>";
echo "<td>" . $row['Date'] . "</td>";
echo "<td>" . $row['Score'] . "</td>";
echo "</tr>";
}
echo "</table>";

mysqli_close($con);
?>

更新

我想我可能有一个使用 javascipt 的更简单的解决方案，尽管它无法正常工作。

使用 JavaScript 函数:

 window.location.reload(true);

并更改我的 html 选择

  <select onchange="refresh.call()">

但是，当页面重新加载时，它使用输入的 $limit 值

  $limit =10;

而不是选择值。

页面刷新正常，但有没有办法以某种方式注入(inject) html 选择值？

Answer 1

清理输入

首先，您需要清理 limit 变量，因为允许直接输入 SQL 是不安全的。

参见:

• What's the best method for sanitizing user input with PHP?和
• https://www.shift8web.ca/2015/06/securing-your-mysql-queries-from-sql-injection-in-php/

单页应用程序方法

其次，您需要决定是否使用 javascript 重写 html 注释(在这种情况下，您将发出 ajax/jquery 请求)。然后您将使用某些框架或 javascript (innerHTML = '') 重写 html 或编辑 DOM 树。

参见: Ajax tutorial for post and get

并且

https://stackoverflow.com/a/19527642/1688441

重新加载页面

如果您决定不想使用 javascript 重写 Dom 树，那么唯一的解决方案是使用带有 limit 参数的 GET 或 POST 刷新整个页面。

因此，您将使用 onChange 监听器，并使用限制参数再次调用该页面。

参见:Reload page after user clicks on combobox (with some rules)