获取选择菜单以根据 MySQL SELECT 结果动态显示特定的选择选项
Posted
技术标签:
【中文标题】获取选择菜单以根据 MySQL SELECT 结果动态显示特定的选择选项【英文标题】：get select menu to dynamically show specific select option based of MySQL SELECT result 【发布时间】：2017-04-20 00:25:49 【问题描述】：我有一个 php 页面，用户在文本字段中输入特定的 ID 号，然后单击“搜索”按钮。单击“搜索”后，将运行一个 php 脚本以连接到 mysql 数据库表“xxx”并获取与用户输入的 ID 号匹配的行 ID。 SELECT 语句获取数据库值：标识行的“productionstage”和“floornotes”。
我需要做的是获取这些结果并将它们显示在我的表单页面上：
选择菜单需要动态显示与行的“productionstage”值对应的选项，然后文本区域需要显示“floornotes”中的值。
我的代码：
html：
<form id="workorderMovement" name='workorderMovement_form' action="workordermovementGET.php" method="post">
<fieldset id="userid">
<span>Welcome <?php echo $user ?> </span>
</fieldset>
<fieldset id="sgnum">
<fieldset id="fieldset" style="text-align: center;">
<span>Please enter the SG Number</span>
</fieldset>
<input type="text" name="sgnumber" id="sgnumber"> <input type="button" name="searchButton" id="searchButton" value="SEARCH">
</fieldset>
<br/>
<br/>
<fieldset id="stageSelectField">
<fieldset id="fieldset" style="text-align: center;">
<span>Please select the Stage Completed</span>
</fieldset>
<select name="stageSelect" id="stageSelect">
<option value="Please Select">Please Select</option>
<option value="Film Done">Film Done</option>
<option value="Staged Done">Staged Done</option>
<option value="Cleanroom Done">Cleanroom Done</option>
<option value="GB2 Done">GB2 Done</option>
<option value="Bagging Done">Bagging Done</option>
<option value="Inspection Done">Inspection Done</option>
<option value="LC Done">LC Inspection Done</option>
<option value="IGU Done">IGU Done</option>
</select>
</fieldset>
<br/>
<br/>
<fieldset id="floorNotesField">
<fieldset id="fieldset" style="text-align: center;">
<span>Please enter any new work order notes</span>
</fieldset>
<textarea type="text" name="floorNotes" id="floorNotes" class="floorNotesText"></textarea>
</fieldset>
<br/>
<br/>
<br/>
</form> <!-- End Work Order Movement Form -->
<fieldset id="doneButtonField">
<input type="button" name="doneButton" id="doneButton" value="DONE">
</fieldset>
我的 AJAX：
j("#searchButton").click(function()
//send Workorder Movement Data values to php using ajax.
var sgnumber = j('#sgnumber').val();
j.ajax (
method: 'POST',
url: "workordermovementGET.php",
data: sgNumber: sgnumber,
dataType: 'json',
success: function( data )
if(data.status)
j("select#stageSelect option").filter(function()
return j(this).val() == data.productionstage;
).prop('selected', true);
j("textarea#floorNotes").val(data.floornotes);
);
);
我的 PHP：
include('inc.php');
//Get Table Options.
if (isset($_POST['sgNumber']))
$sgNumber = $_POST['sgNumber'];
//connect to the database
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if(mysqli_connect_errno() )
printf('Could not connect: ' . mysqli_connect_error());
exit();
$conn->select_db($dbname);
if(! $conn->select_db($dbname) )
echo 'Could not select database. '.'<BR>';
$sql= "SELECT productionstage, floornotes FROM invoices WHERE id = ?";
$stmt = $conn->prepare($sql);
$stmt->bind_param('i', $sgNumber);
$stmt->execute();
$stmt->store_result();
if ($stmt->num_rows == 1)
$stmt->bind_result($productionstage, $floornotes);
$stmt->fetch();
echo json_encode(array('status' => true, 'productionstage' => $productionstage, 'floornotes' => $floornotes));
else
echo json_encode(array('status' => false));
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//Free the result variable.
$result->free();
//Close the Database connection.
$conn->close();
//End If statement
?>
我需要知道如何正确地将我的 ajax 结果的一部分作为选择选项发布（数据库值将与预定义的选择选项之一匹配），并获取其余结果并显示在 textarea 中。另外，如果我能动态地做到这一点，那就完美了。
谢谢！
【问题讨论】：
您的代码中存在 SQL 注入漏洞！ 是的，我知道。我正在同时研究如何避免这种情况......对于已知链接/教程的任何建议都非常感谢。谢谢！ 【参考方案1】：您需要对代码进行一些更改，例如：
您需要将结束 </form> 标记放在 DONE 按钮下方，如下所示：
...
<fieldset id="doneButtonField">
<input type="button" name="doneButton" id="doneButton" value="DONE">
</fieldset>
</form>
您的问题并未真正解释您打算如何使用此 DONE 按钮，但我相信您对此有所了解。然而，这个答案围绕 SEARCH 按钮以及相关的 jQuery/AJAX 和 PHP 功能。
按以下方式更改您的 jQuery/AJAX 脚本，
$("#searchButton").click(function()
var sgnumber = $('#sgnumber').val();
$.ajax (
method: 'POST',
url: "workordermovementGET.php",
data: sgNumber: sgnumber,
dataType: 'json',
success: function( data )
if(data.status)
$("select#stageSelect option").filter(function()
return $(this).val() == data.productionstage;
).prop('selected', true);
$("textarea#floorNotes").val(data.floornotes);
);
);
它从下拉列表中选择一个特定的productionstage，并根据用户在输入文本字段中输入的id值填充floornotes数据。
最后，按以下方式处理您的 AJAX 请求，即您的 PHP 代码应如下所示：
<?php
include('inc.php');
if (isset($_POST['sgNumber']))
$sgNumber = $_POST['sgNumber'];
//connect to the database
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if(mysqli_connect_errno() )
printf('Could not connect: ' . mysqli_connect_error());
exit();
$conn->select_db($dbname);
if(! $conn->select_db($dbname) )
echo 'Could not select database. '.'<BR>';
$sql= "SELECT productionstage, floornotes FROM invoices WHERE id = ?";
$stmt = $conn->prepare($sql);
$stmt->bind_param('i', $sgNumber);
$stmt->execute();
$stmt->store_result();
if ($stmt->num_rows == 1)
$stmt->bind_result($productionstage, $floornotes);
$stmt->fetch();
echo json_encode(array('status' => true, 'productionstage' => $productionstage, 'floornotes' => $floornotes));
else
echo json_encode(array('status' => false));
?>
它使用prepared statement，因此您可以确定它对 SQL 注入攻击相当安全。此外，这是一个很好的阅读how you can prevent SQL injection in PHP?
【讨论】：
谢谢！到目前为止，这很有帮助。但是，我仍然看到我的选择菜单没有随着 ajax 的结果而改变。不过，我的文本区域运行良好。我的测试 ID 的选择菜单应更改为下拉选项“电影完成”，因为这是从数据库接收的数据。但是，它不会从列表中的第一个选项改变。 @rdimouro 在success 回调函数中执行alert(data.productionstage); 并查看您从服务器返回的值。
警报应返回“电影完成”。我似乎无法让选择菜单更改为相同的选项。可能是 .prop() 问题吗？
@rdimouro 那是因为您正在寻找 text 属性，而不是下拉列表的 value 属性。在成功回调函数中，将return $(this).val() == data.productionstage;这一行改成返回$(this).text() == data.productionstage;
@rdimouro 我的工作正常。您是否更改了 jQuery 代码 sn-p 中的任何内容？如果您更改了任何内容，请将您的 jQuery 代码 sn-p 粘贴到 pastebin.com 并在此处给我它的链接。此外，这个检索到的 productionstage 值是否与下拉列表的 value 或 text 部分匹配？【参考方案2】：
您需要使用您的数据库结果和echo json_encode($your_array); 创建一个数组。这会将您的数据作为 JSON 对象返回给 Ajax 成功函数。然后，您可以解析该对象以获取 select 的数据和 textarea 的数据。我不记得您是如何使用 JS 更改所选选项的，但我知道它通常是 Google 搜索中的第一个或第二个链接/
【讨论】：
以上是关于获取选择菜单以根据 MySQL SELECT 结果动态显示特定的选择选项的主要内容，如果未能解决你的问题，请参考以下文章
MySQL SELECT 来自 1 个表的结果，但根据另一个表排除结果？