如何将一个选择元素与另一个选择语句相关联
Posted
技术标签:
【中文标题】如何将一个选择元素与另一个选择语句相关联【英文标题】：How to relate one select element to another select statement 【发布时间】：2019-03-21 22:52:57 【问题描述】：我在一个表单中有两个 select html 元素。每当用户单击“添加”按钮时，都会创建这两个选择元素。所以表单里面有这对html select语句的多个实例。代码如下所示：
<form action="create.php" method="POST">
<div class="user_role">
<select name="users[]">
<option value="1"> John </option>
<option value="2"> Doe </option>
</select>
<select>
<option value="1"> Browser </option>
<option value="2"> Project Manager </option>
</select>
</div>
<div>
<input type="button" name="add" id="add" value="Add User"
</div>
<div>
<input type="submit" name="submit" value="submit" />
</div>
</form>
如果我点击提交按钮，$_POST 数组包含以下值：
Array (
[users] => Array (
[0] => 1
)
[submit] => submit
)
我不知道在第二个 select 的“name”属性上放置什么，以便连接两个 select 语句。
我想要完成的是，当存储在 $_POST 全局数组中时，我希望有一种方法可以将第二个选择上的值引用为第一个选择上其相应用户的角色值。示例：
User: John <-- first html select statement
role: Browser <-- second html select statement
___________________________________________________
User: Doe <-- first html select statement
role: Project Manager <-- second html select statement
【问题讨论】：
1：永远不要在表单中调用任何“提交”——它会影响提交方法； 2：你说的是级联下拉吗？如果是这样，您可以查看 PHP AJAX 在第二个选择菜单中添加名称标签，如<select name= 'role'>，并在第一个标签中删除数组，如<select name= 'Users'>。如果要连接，请在提交后连接
@mplungjan - 不，这不是级联下拉菜单。有两种选择。一个选择用户的下拉菜单。另一个选择是角色。见下面的例子： John Browser
@BilalAhmed - 不，我无法删除用户选择的数组名称，因为可以有多个用户。如果不是数组，那么无论添加多少用户，$_POST数组上只传递一个值。
我认为你应该使用复选框而不是选择
【参考方案1】：
你可以试试这样的：
<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php">
<select name="users[1][name]">
<option value="1"> John </option>
<option value="2"> Doe </option>
</select>
<select name="users[1][role]">
<option value="1"> Browser </option>
<option value="2"> Project Manager </option>
</select>
<div>
<input type="submit" name="submit" value="submit" />
</div>
</form>
</body>
</html>
提交的表单数据如下所示：
users[1][name]=1&users[1][role]=1&submit=submit
如果您想以用户身份添加另一组选择输入 - 只需增加该值即可。所以下一个添加的集合看起来像这样：
<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php">
<select name="users[1][name]">
<option value="1"> John </option>
<option value="2"> Doe </option>
</select>
<select name="users[1][role]">
<option value="1"> Browser </option>
<option value="2"> Project Manager </option>
</select>
<!-- Newly added by js -->
<select name="users[2][name]">
<option value="1"> John </option>
<option value="2"> Doe </option>
</select>
<select name="users[2][role]">
<option value="1"> Browser </option>
<option value="2"> Project Manager </option>
</select>
<div>
<input type="submit" name="submit" value="submit" />
</div>
</form>
</body>
</html>
如果在创建时确定要插入的索引有问题，您需要修改您的 JS“添加”函数。
有几种方法 - 您可以存储一些变量来保持从 1 开始的用户数量，每次添加时您都会增加它。
您还可以计算选择次数并获得适当数量的下一个元素 您还可以修改表单的结构，以将两个选择存储在具有某些类的 div 中，并在其上执行元素计数。
这里有一些关于 jsFiddle 和 vanilla javascript 的指导： https://jsfiddle.net/mrba8dLy/
【讨论】：
谢谢托马斯。这实际上就是我想要的。但是，我很难做到这一点，因为“添加”按钮是创建这两个选择语句的原因。如果是用户 [1]、用户 [2]、用户 [3] 等，我无法跟踪。 刚刚修改了我的答案，试试这个jsFiddle里面的建议和例子，（你必须打开控制台才能看到结果）jsfiddle.net/mrba8dLy以上是关于如何将一个选择元素与另一个选择语句相关联的主要内容，如果未能解决你的问题，请参考以下文章