根据下拉字段选择从数据库填充表单文本字段

时间:2013-11-06 20:59:47

标签: javascript php mysql forms

我已经挖过很多帖子但是在这里找不到像这样的场景......

我有一个PHP表单,其中包含一个下拉选项,其中包含MySQL数据库表中的选项值。这部分工作正常。这是我需要帮助的地方......

我需要使用textarea字段填充来自同一数据库表的数据,但需要使用不同的字段。该表包含“名称”和相应的“文本”集。下拉列表显示“名称”作为选项。所以我需要的是在进行选择时,脚本运行(如onChange)...获取所选值,查询数据库以获取与所选“名称”相关联的“文本”。然后,'text'将显示在textarea表单字段中。

此代码的一部分供您查看:

echo "<form action=$PHP_SELF method=\"post\">\n";
echo "<select id=\"conditions\" name=\"conditions\">\n";
echo "<option value=\"Select\" selected>Select a Message</option>\n";

$result = mysqli_query($link, "SELECT * FROM db_scripts");
while ($data = mysqli_fetch_object($result)) {
    echo "<option value=".$data->script_id.">".$data->script_name."</option>\n";
}

echo "</select>\n";

echo "<br><textarea name=\"message\" style=\"width:300px; height:130px\" data-maxsize=\"160\" data-output=\"status1\" wrap=\"virtual\" maxlength=\"160\"></textarea><br />\n";

所以,就像我说的那样,这部分工作正常。我有'script_name'作为选项的下拉列表。现在我只需要将相应的消息输入textarea字段“message”。非常感谢任何帮助!

3 个答案:

答案 0 :(得分:2)

使用以下格式在PHP中创建关联javascript对象文字数组:

<?php
echo "
<!-- this script goes in your <head> -->\n
<script>\n
var db_array = [";
$result = mysqli_query($link, "SELECT * FROM db_scripts");
$first = TRUE; // remove trailing comma from array
while ($data = mysqli_fetch_object($result)) {
  if ($first === TRUE) $first = FALSE;
  else echo ',';
  echo "
  {
    id: '$data->script_id',
    name: '$data->script_name'
    message: '$data->script_message'
  }";
}
echo "];\n
</script>";
?>

问题是,如果您的邮件与ID不在同一行,则需要在查询中使用JOIN。这部分背后的想法是你只需要查询一次数据库。您不希望客户端每次在下拉菜单中切换选项时都查询数据库。例外情况是,如果您有兆字节以上的消息。在这种情况下,请考虑实施缓存措施。

继续......一旦你构建了数组,就可以通过遍历数组来构建你的<option>

<?php
echo "
<form action=\"$PHP_SELF\" method=\"post\">\n
<select id=\"conditions\" name=\"conditions\">\n
<option value=\"Select\" selected>Select a Message</option>\n
<script>\n
for (var i = 0; i < db_array.length; i++) {\n
  document.write('<option value=\"'+db_array[i].id+'\">'+db_array[i].name+'</option>');\n
}\n
</script>\n
</select>\n
<!-- notice the id attribute I added -->\n
<br><textarea id=\"message\" name=\"message\" style=\"width:300px; height:130px\" data-maxsize=\"160\" data-output=\"status1\" wrap=\"virtual\" maxlength=\"160\"></textarea><br />\n";
?>

...然后有一个脚本可以访问这些动态创建的DOM元素(例如在<body>标记的末尾)

<script>
// returns the db_array index of the object id supplied
function returnIndex (id) {
  for (var i = 0; i < db_array.length; i++) {
    if (db_array[i].id === id) return i;
  }
  return -1; // returns index of -1 if id is not found
}
// changes the <textarea> message. notice the id I added to the messages <textarea> above
function changeMessage (id) {
  // remember to handle the case of an id not being found within db_array (where returnIndex returns -1)
  document.getElementById('message').innerHTML = db_array[returnIndex(id)].message;
}
// on the event that we switch options, do this event. realize that you'll have to run the changeMessage function once the page loads if you want the first option's message to show
document.getElementById('conditions').onchange = function() {
  changeMessage(this.selectedIndex);
}
</script>

答案 1 :(得分:1)

您可以将表单操作设置为GET。 然后,如果设置了conditions查询参数,请从数据库中选择相应的文本,并显示它是textarea。所以使用PDO s

$text = "";
if(isset($_GET["conditions"])){
    $db->prepare("
        SELECT text
        FROM db_scripts
        WHERE script_name = ?
    ");

    $stmt->bindColumn(1, $type);
    $stmt->execute();
    $row = $stmt->fetch();
    if(!empty($row)){
        $text = htmlentities($row["text"]);
    }
);


echo "</form><textarea name=\"message\" style=\"width:300px; height:130px\" data-maxsize=\"160\" data-output=\"status1\" wrap=\"virtual\" maxlength=\"160\">$text</textarea><br />\n";

答案 2 :(得分:1)

好的,我已经解决了这个问题......但最终没有使用任何其他答案。我尝试过它们,尤其是Jared的那个。它让我非常接近,但最终还是没有完全奏效。我确实从Jare​​d那里获得了一些非常有用的方向和想法!最后,我找到了一种更简单的方法来完成这项工作......

1)从Google <head>区域拉出JQuery。没有其他脚本加载到那里。

2)将此代码放在我的表单上方的PHP文件中,但不在<?php>标记之内。

<script>
$(function () {
    $("#conditions").change(function() {
    $("#message").val($("#conditions").val());
   })
   $("#conditions").trigger("change");
})
</script>

3)将下拉选择字段和textarea目标字段设置为...

$result = mysqli_query($link, "SELECT * FROM db_scripts");
$first = TRUE; // remove trailing comma from array
while ($data = mysqli_fetch_object($result)) {
$html_opts .= "<option value='".preg_replace('/[^a-zA-Z0-9\s]/', '', strip_tags($data->script_text))."'>".$data->script_name."</option>";   
}
echo '<select id="conditions" name="conditions">';
echo '<option value="" selected>Select a Script</option>';
echo $html_opts.'</select>';
echo '<br><textarea id="message" name="message" style="width:300px; height:130px" data-maxsize="160" data-output="status1" wrap="virtual" maxlength="16\"></textarea><br />';

当然整个表格不会在这里发布,但重要的部分是。这对我来说非常合适。希望它也可以帮助其他人!