0

選択フィールドの後に追加ボタンが続くフォームがあります。ユーザーが追加をクリックすると、選択したアイテムを配列に追加して、フォームに渡すことができます

// これは私の可視フィールドです

<select id="contactsFollow" name="contactsFollow">
  <option value="1">option 1</option>
  <option value="2">option 2</option>
  <option value="3">option 3</option>
</select> 
<button type="button" class="btn">Add</button>

これを行うための最良の方法は何ですか？私はjqueryがこれを行うと仮定していますが、実装方法についての手がかりがありません.

4

2 に答える 2

2

デモ： http： //jsfiddle.net/MsNKR/

$('.btn').click(function () {
  $('#contactsFollow :selected').appendTo('#contactsFollowSelected');
});

またはデモ： http： //jsfiddle.net/zvQgq/最初の選択からオプションを削除したくない場合

$('.btn').click(function () {
  $('#contactsFollow :selected').clone().appendTo('#contactsFollowSelected');
});
于 2013-01-05T18:33:35.843 に答える
1

私はあなたが何をしようとしているのかわかりません..しかし、それを選択に追加してフォームに渡すことは、フォームに渡すために非表示の選択ボックスをもう一度選択する必要があるため、私には意味がありません...とにかくjquery私にとって最良の選択肢です。

そして、これがあなたがそれをする方法です。

$('.btn').click(function () {
  $('#contactsFollow :selected').appendTo('#contactsFollowSelected');
});

更新しました

非表示の入力フィールドを作成します。

<input type="hidden" name="selectedoption" id="selectedoption" value="" />

jquery

$('.btn').click(function () {
   var selected=$('#contactsFollow :selected').val();
   var hiddeninputValue=$('#selectedoption').val();
   if(hiddeninputValue==""){
      $('#selectedoption').val(selected);
   }else{
      $('#selectedoption').val(hiddeninputValue + ',' + selected);
   }
   $('#contactsFollow :selected').remove();
});

非表示の値を「、」で区切ってから、dbに挿入します。

フィドルの例

于 2013-01-05T18:35:08.677 に答える