使用 AJAX 和 PHP 动态填充 HTML DropDown 控件答案

【问题标题】：Dynamically populating HTML DropDown controls using AJAX and PHP使用 AJAX 和 PHP 动态填充 HTML DropDown 控件
【发布时间】：2010-12-16 23:18:44
【问题描述】：

为了在我的 HTML 表单上动态填充 DropDown 控件，我编写了使 AJAX 调用 .php 文件的代码。此 .php 文件使用单个列值填充 DropDown 控件。

在整个过程中，三个文件扮演了角色。

(1) 包含输入表单的 HTML 文件， (2) 包含基本 AJAX 代码的 .js 文件，以及 (3) 一个 .php 文件，其中包含在我的 HTML 表单上填充 DropDown 控件的代码。

下面，我分别给出了所有三个文件的必要代码。 DropDown 没有填充，因此，我想知道下面给定代码中所需的必要更正。

请注意，.js 文件中的 MakeRequest 函数接受的参数很少。这些论点是：

(1) HTML DropDown 控件名称， (2) 整个 Sql 查询。 (3) MySQL 表中的 ID 列。 (4) DropDown控件中需要填充值的实际列。

在这种情况下，例如，我引用了一个名为“ElectionCategoryMaster”的 MySQL 表，它由以下列组成：

(1) ecID Int P.K (2) ecName varchar

我将 ID 列作为参数传递，以便在用户从 DropDown 中选择 ecName 时检索此 ID 值。这个 ecID 将存储在不同的表中。

[代码：HTML 文件]

<td onactivate="javascript: MakeRequest('inCategory','SELECT * FROM electioncategorymaster', 'ecid', 'ecname');">
    <select id="inCategory" name="inCategory" class="entryFormInputBoxColor">

    </select>
</td>

[代码：.js 文件] [AJAX]

function MakeRequest(DropDownName, SqlQuery, IdColumnName, DisplayColumnName)
{
  var xmlHttp = getXMLHttp();

  xmlHttp.onreadystatechange = function()
  {
    if(xmlHttp.readyState == 4)
    {
      HandleResponse(xmlHttp.responseText);
    }
  }
  xmlHttp.open("GET", "filldropdown.php?DropDownControlName = " + DropDownName + "&SqlQuery = " + SqlQuery + "&IdColumnName = " + IdColumnName + "&DisplayColumnName = " + DisplayColumnName, true);
  xmlHttp.send(null);
}

function HandleResponse(response)
{
  document.getElementById('ResponseDiv').innerHTML = response;
}

[代码：.php 文件] [填充所需的下拉控件]

<?php

//Get values
$dropdownControlName = $_GET['DropDownControlName'];
$sqlQuery = $_GET['SqlQuery'];
$idColumnName = $_GET['IdColumnName'];
$displayColumnName = $_GET['DisplayColumnName'];
echo "dfddddf";
        dbconnection::OpenConnection();
        $result = dbaccess::GetRows($sqlQuery);
        // JavaScript code to populate the DropDown.
        echo "<select name='". $dropdownControlName ."'>";
        echo "<option>Select</option>";
        while($row=mysql_fetch_array($result))
        {
            echo "<option value=<?=". $row[$idColumnName] ."?>><?=". $row[$displayColumnName] ."?></option>";
        }
        echo "</select>";
        dbconnection::CloseConnection();
?>

【问题讨论】：

您是否认真地将数据库查询暴露给浏览器？我通过分数闻到了 SQL 注入攻击。
@gabriel：是的，你是对的。我需要改进代码。

标签： php javascript html ajax

【解决方案1】：

我相信 javascript 是问题的根源。让我解释：函数HandleResponse() 总是填写相同的ID。 MakeRequest() 函数中的变量 DropDownName 不会在任何地方传递给 HandlResponse() 函数。尝试添加这个参数，它应该会更好。

除此之外，直接在 javascript 中使用 MySQL 查询是一个大安全问题。
1) 你告诉人们你的数据库的内部结构。
2）人们可以修改这个请求来检索他们想要的任何东西！来自您的数据库！

永远不要直接用户输入（是的，GET 参数可以是用户输入：它是一个简单的 GET 变量，每个人都可以访问它）。

【讨论】：

哦，是的，查询没有正确使用。需要进一步改进。
好的，太好了！除此之外，javascript 的事情解决了你的问题吗？

【解决方案2】：

我曾经使用 javascript 生成查询字符串，但能够省略许多重要的细节，例如表名和 WHERE 条件。我还确保在其上使用 mysql_real_escape_string，将字符串添加到前后服务器端以形成完整的查询字符串。这比尝试发布数组要容易得多。我觉得这是一个更安全、更容易的选择。

【讨论】：