数据库php/html/javascript的下拉列表

xmd2e60i 于 2021-06-20 发布在 Mysql

关注(0)|答案(1)|浏览(334)

我想用javascript从数据库创建一个下拉列表。我正在尝试创建一个动态窗体，在其中可以使用“addmore”按钮添加多行。我的html表单包含一个输入类型文本和一个下拉列表
在html中

<form id="add_name" name="add_name">
<table class="table table-bordered" id="dynamic_field">
<tr>
    <td>
    <select class="form-control" name="nom_ar">
    <?php                   
    while ($row2 = $result2->fetch_assoc()){
    echo "<option value='".$row2['nom_ar']."'>".$row2['nom_ar']."   </option>";
        }
    ?>
    </select>
    </td>
    <td><input type="text" name="name[]" placeholder="insert name" class="form-control name_list" /></td>
    <td><button type="button" name="add" id="add" class="btn btn-success">add more</button></td>
</tr>

</table>
</form>

在javascript代码中，我只添加了输入类型文本，我不知道如何添加下拉列表，如下面的代码所示：

$('#add').click(function(){
    i++;
    $('#dynamic_field').append('<tr id="row'+i+'"><td><select class="form-control" name="nom_ar"><?php while ($row2 = $result2->fetch_assoc()){echo "<option value='".$row2['nom_ar']."'>".$row2['nom_ar']."</option>";} ?></select></td><td><input type="text" name="name[]" placeholder="Ingredient" class="form-control name_list" /></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td></tr>');

}
我该怎么做？我在js中的下拉列表总是空的。作为一个初学者，我正在努力。我应该把php代码放在哪里？

mysql php JavaScript Html

来源：https://stackoverflow.com/questions/52635663/drop-down-list-from-database-php-html-javascript

1条答案

按热度按时间

cgyqldqp1#

这是你的js代码

<script type="text/javascript">
    $('#add').click(function() {
            $("#dynamic_field").append("<tr></tr>");
            $.post("server.php", {
                        object_field:   "Any data", 
                    }, function(server_data) {
                        $("#dynamic_field tr:last-child").html(parse_server_data(server_data));
                    });
                });

    function parse_server_data(data) {
            data = JSON.parse(data);
            var output_string = "<td><select>";
            for (var key in data) {
                var value = data[key];
                output_string += "<option value=" + key + ">" + value + "</option>";
            }
            output_string += "</select></td>";

            return output_string;
    }
</script>

我故意将服务器端代码（server.php文件）和js代码分开。为什么？您不应该混用服务器端和客户端的代码，而应该使用ajax技术的强大功能。在server.php中添加echo所有必要数据的代码（在您的示例中是fetch\u assoc）。了解mvc模型https://en.wikipedia.org/wiki/model%e2%80%93view%e2%80%93controller
我还添加了json.parse函数。json是数据压缩和提交的标准，请检查php中的json\u encode/json\u decode函数并使用它们
不要经常使用表格，练习div/span

赞(0）回复(0）举报 2021-06-21

我来回答

数据库php/html/javascript的下拉列表

1条答案

相关问题

热门标签

最新问答