如何从多选下拉菜单中获取值并将它们与 POST 一起发送？

Posted 2023-03-08

【中文标题】如何从多选下拉菜单中获取值并将它们与 POST 一起发送？

【英文标题】：How to grab values from a multiple select dropdown menu and send them along with POST?

【发布时间】：2014-10-27 06:26:28

【问题描述】：

我想将这种类型的多选下拉菜单添加到我的表单中

<form>
...
    <select id="example2" multiple="multiple">
        <div id="otherChoices">
            <optgroup label="Academic" class="blah">
                <option value="Engineering" class="blah">Engineering</option>
                <option value="Humanities">Humanities</option>
                <option value="Life_Sciences">Life Sciences</option>
                <option value="Social Sciences_Sciences">Social Sciences</option>
            </optgroup>
            <optgroup label="Clubs">
                <option value="Event">Event </option>
                <option value="Meeting">Meeting</option>
                <option value="Performance">Performance</option>
            </optgroup>
            <optgroup label="Personal">
                <option value="Discussion">Discussion</option>
                <option value="Event">Event</option>
                <option value="Food">Food</option>
                <option value="Hangout">Hangout</option>
                <option value="Trip">Trip</option>
            </optgroup>
        </div>
    </select>
</form>

但我不确定这是什么类型的输入表单（它是引导创建的表单，但不是有效的输入类型），所以我不确定如何通过发布请求发送参数。目前，我正在使用 jquery 来获取选定的值并填写一个隐藏的表单。有没有更好的办法？

【问题讨论】：

您的工作方式是否有效？有什么问题？

只需将整个 <select> 复制到您的隐藏表单中，然后让浏览器或 jquery 在提交时执行它们的操作。

我对你的问题有点困惑。输入类型无效是什么意思？选择字段是有效的输入类型。请举个例子。

【参考方案1】：

您在 html 中犯了一些错误： 这是修正版：

<form action="test2.php" method="post">
    <select name="example2[]" id="example2" multiple="multiple" >
        <div id="otherChoices" name="hello">
            <optgroup label="Academic" class="blah">
                <option value="Engineering" class="blah">Engineering</option>
                <option value="Humanities">Humanities</option>
                <option value="Life_Sciences">Life Sciences</option>
                <option value="Social Sciences_Sciences">Social Sciences</option>
            </optgroup>
            <optgroup label="Clubs">
                <option value="Event">Event </option>
                <option value="Meeting">Meeting</option>
                <option value="Performance">Performance</option>
            </optgroup>
            <optgroup label="Personal">
                <option value="Discussion">Discussion</option>
                <option value="Event">Event</option>
                <option value="Food">Food</option>
                <option value="Hangout">Hangout</option>
                <option value="Trip">Trip</option>
            </optgroup>
        </div>
    </select>
    <button type="submit">Submit</button>
</form>

编辑： 这是我更正的：

我在带有方括号的选择中添加了一个名称值以显示其数组 我在表单中添加了一个方法类型：method="post" 提交按钮

然后您可以像这样访问各个项目：

echo $_POST["example2"][0];

编辑：对不起，我意识到这是 Node.js 那一个是 PHP 的。有关如何在节点 js 中获取 post 变量的信息，请参阅此链接：

How do you extract POST data in Node.js?

【讨论】：

感谢您的回答...干得好...！

【参考方案2】：

当您提交表单时，它会将一个数组传递到下一页，该数组在表单的action 属性中指定。如果没有设置，它将提交到当前 URL。

默认情况下，表单将使用GET 提交，除非将method 属性设置为post。

因此，请将您的 <form> 标签更改为以下内容：

<form method="post" action="test.php">

给你的select 一个name，比如name="test_select"。

然后您的test.php 可以如下所示：

<?php
  print_r($_POST);

（不需要?>结束标签）

这将打印$_POST 数组，您将看到多选是如何工作的。