时间戳

首页 > 解决方案 > 根据下拉选择mysqli自动填充文本输入字段

javascript - 根据下拉选择mysqli自动填充文本输入字段

问题描述

我创建了一个下拉列表，该列表由我的 mysql 数据库中的数据填充并使用 php 进行编程。我需要做的是根据下拉列表中的选择填充文本字段。不幸的是，我的问题与该论坛上的其他问题不同，因为大多数人只是将所有选项输入到 html 表单中。我的包含在一个表中，我不想将文本字段中的内容保存到我的数据库中......它将仅供用户参考。

我已经阅读了该站点和其他许多论坛上的大量帖子，并尝试使用 jquery、javascript 和 ajax 脚本，但由于某种原因，我唯一成功地出现在文本字段中的是 id从下拉列表中选择的相应项目。我认为重要的是要知道两个字段都来自数据库中的同一张表，所以我不明白为什么自动填充字段如此困难。我想使用 javascript，因为我想要这个文件中的所有内容。

这是php形式的代码：

<?php
        '<div id="trxdetailstable">';

        echo '<table align="center" width="750px" cellspacing="0" border=".5px" ! important><tr>
         <th>Movie Title</th><th>Category</th><th>Price</th></tr>'; 
        echo '<td align="left" width="8%" height="25px">';
            $ddlquery4 = "SELECT id, title, categoryname FROM dvd ORDER BY title ASC";
            $ddlresult4 = mysqli_query($dbc, $ddlquery4) or die("Bad SQL: $ddlquery4");

            echo '<select class="dropdown" name="dvdid" id="dvdid" size="1" onchange="updatecat()">';
            while($ddlrow4=mysqli_fetch_array($ddlresult4, MYSQLI_ASSOC)){

                $categoryname = $ddlrow4['categoryname'];

            echo "<option data-categoryname='' value='".$ddlrow4['id']."'>" . $ddlrow4['title'] . "</option>";

            } //End while statement
            echo "</select>";
            echo '</a></td>';
            echo '<td align="left" width="10%">';
            echo '<input required id="categoryname" name="categoryname" type="text" readonly="readonly">';
            echo '</a></td>';

这是我目前在 html 头中的代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

这是当前未生成任何结果的代码（选择下拉项后文本字段留空）：

$('#dvdid').change(function(e){
    var optionChange = $('#dvdid option:selected').text();
    $('#categoryname').val(optionChange);
});
</script>

这是实际上给了我在下拉列表中选择的项目的主键（id）的代码（我希望它是类别名称）：

<script>
    function updatecat(id){
    if (id === "") {
        $("input[name=categoryname]").val("");
    } else {
        $("input[name=categoryname]").val(id);            
    }
}
</script>

我尝试过大约 3 个其他脚本，但它们都将文本（类别）字段留空。

任何意见，将不胜感激。请记住，我的所有数据都是从非手动输入的数据库中生成的。谢谢。

标签： javascriptphphtmlmysql

解决方案

您有重复的行并且不要ID对它们使用属性，您可以使用这样的类：

$('select.dropdown').change(function(e){
    var optionChange = $(this).find('option:selected').text();
    $(this).closest("tr").find(".categoryname").val(optionChange);
});

你的 php 代码应该是这样的：

<?php
        '<div id="trxdetailstable">';

        echo '<table align="center" width="750px" cellspacing="0" border=".5px" ! important>
        <tr>
          <th>Movie Title</th>
          <th>Category</th>
          <th>Price</th>
        </tr>'; 
        echo '<tr>
        <td align="left" width="8%" height="25px">';
            $ddlquery4 = "SELECT id, title, categoryname FROM dvd ORDER BY title ASC";
            $ddlresult4 = mysqli_query($dbc, $ddlquery4) or die("Bad SQL: $ddlquery4");

            echo '<select class="dropdown" name="dvdid" id="dvdid" size="1" onchange="updatecat()">';
            while($ddlrow4=mysqli_fetch_array($ddlresult4, MYSQLI_ASSOC)){

                $categoryname = $ddlrow4['categoryname'];

            echo "<option data-categoryname='' value='".$ddlrow4['id']."'>" . $ddlrow4['title'] . "</option>";

            } //End while statement
            echo "</select>";
            echo '</a></td>';
            echo '<td align="left" width="10%">';
            echo '<input required class="categoryname" id="categoryname" name="categoryname" type="text" readonly="readonly">';
            echo '</a></td></tr>';

推荐阅读