0

我已经将这两个下拉列表编码在一起。一个是国家，一个是空的。当您单击一个国家并按添加时，该国家将移至空白下拉列表。您可以根据需要多次执行此操作。

但是在提交表单时，我无法访问第二个下拉列表的发布数据。这是我的代码：

JavaScript：

function moveData(dir) {
var sF = document.getElementById(((dir == "back")?"destinationSelect":"sourceSelect"));
var dF = document.getElementById(((dir == "back")?"sourceSelect":"destinationSelect"));
if(sF.length == 0 || sF.selectedIndex == -1) return;
while (sF.selectedIndex != -1) {
    dF.options[dF.length] = new Option(sF.options[sF.selectedIndex].text, sF.options[sF.selectedIndex].value);
    sF.options[sF.selectedIndex] = null;
}
}

HTML：

<select name="sourceSelect[]" id="sourceSelect" size="5"  ondblclick="moveData(); return false;">
<optgroup label="North America">
    <option value="NORTHAMERICA_UNITEDSTATES">United States</option>
    <option value="NORTHAMERICA_BAHAMAS">Bahamas</option>
    <option value="NORTHAMERICA_BARBADOS">Barbados</option>
    <option value="NORTHAMERICA_BELIZE">Belize</option>
    <option value="NORTHAMERICA_CANADA">Canada</option>
    <option value="NORTHAMERICA_COSTARICA">Costa Rica</option>
    <option value="NORTHAMERICA_CUBA">Cuba</option>
</select>   

<input type="submit" name="forward" id="button" value=">>>>" onclick="moveData(); return false;"/>
<input type="submit" name="back" id="button" value="<<<<" onclick="moveData('back'); return false;"/>

<select name="destinationSelect[]" id="destinationSelect" size="5" ondblclick="moveData('back'); return false;">

所以，是的，我不确定如何在表单提交时发布第二个下拉列表，或者我需要输入什么才能看到它。像 echo $_POST['destinationSelect[]'] 不起作用。

4

2 回答 2

2

select提交表单时不会发送元素中可用的值，仅发送选定的值。

我在这里看到两个选择：

  1. 在第二个框中添加项目并自动选择它。丑陋，但它有效，除非用户“取消选择”这些项目。不过，我不希望你这样做。
  2. 创建隐藏字段以保存项目的值。当您将一个项目“移动”到第二个select时，您还将它添加到隐藏字段的值中。这个实现更好，因为不管用户是否弄乱了第二个select，它都可以工作（它将作为一个可视组件，但不会做实际工作）。
于 2012-09-13T16:56:30.713 回答
1

当您提交表单时，您需要选择第二个（已选择）字段中的所有项目；

    <input name="Submit" type="submit" value="submit"  onclick="selectAllOptions('destinationSelect');" />

然后是javascript；

function selectAllOptions(selStr)   {
    var selObj = document.getElementById(selStr);
    for (var i=0; i<selObj.options.length; i++) {
        selObj.options[i].selected = true;
    }
}

否则他们在那里但没有被选中

于 2012-09-13T16:58:17.000 回答