0

これらの2つのドロップダウンリストを一緒にコーディングしました。1つは国でいっぱいで、もう1つは空です。国をクリックして[追加]を押すと、その国は空のドロップダウンリストに移動します。これは何度でも実行できます。

しかし、フォームが送信されたときに、2番目のドロップダウンリストの投稿データにアクセスできません。これが私のコードです:

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;">

そうですね、フォームの送信時に2番目のドロップダウンリストを投稿する方法や、フォームを表示するために何を入力する必要があるのか​​わかりません。echo $ _POST['destinationSelect[]']のように機能しません。

4

2 に答える 2

2

要素で使用可能な値selectは、フォームの送信時に送信されず、選択された値のみが送信されます。

ここには2つの選択肢があります。

  1. 2番目のボックスにアイテムを追加し、自動的に選択します。醜いですが、ユーザーがこのアイテムを「選択解除」しない限り、機能します。しかし、私はあなたがこれをすることはありません。
  2. アイテムの値を保持するための非表示フィールドを作成します。アイテムを2番目に「移動」すると、そのアイテムselectも非表示フィールドの値に追加されます。この実装は、ユーザーが2番目をいじっても機能するため、より優れていますselect(視覚的なコンポーネントとして機能しますが、実際の作業は行いません)。
于 2012-09-13T16:56:30.713 に答える
1

フォームを送信するときは、2番目の(選択した)フィールドですべての項目を選択する必要があります。

    <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 に答える