javascript - select2()フィールドにソート順を保存する方法は?

Question

select2ライブラリを使用してselect2()フィールドを使用しており、フィールドでドラッグ アンド ドロップによる並べ替えが有効になっています。

うまく機能しますが、保存すると、順序が崩れ、アルファベット順に並べられます。

select2() フィールドにドラッグドロップした後、要素の順序をとにかく保存できるかどうか疑問に思っていました。

提案してください。

Answer 1

Select2はバージョン 4 に進みました。これは<select/>、<option/>-tags ではなく、<input/>-tags に基づいています。次のようにバージョン4で解決しました：

$(".select2").select2().on('select2:select', function(e){
  var $selectedElement = $(e.params.data.element);
  var $selectedElementOptgroup = $selectedElement.parent("optgroup");

  if ($selectedElementOptgroup.length > 0) {
    $selectedElement.data("select2-originaloptgroup", $selectedElementOptgroup);
  }

  $selectedElement.detach().appendTo($(e.target));
  $(e.target).trigger('change');
})

基本的に、選択したアイテムを選択オプションリストから削除して再度追加し、選択順に表示します。

Answer 2

さて、私はあなたの問題を抱えていました。こんな感じで克服できました…

1. 注文を保存するための非表示の入力。
2. select2 のリスナー。

$("#reports").on('change', function(){
    var data = $(this).select2('data');
    var array = [];
    $.each(data, function(index, val) {
        array[index]=val.id;
    });
    array.join(',');
    $("input[name=reports]").val( array );
});

<form class="form-horizontal form-bordered" action="#something" method="post" accept-charset="utf-8" target="_blank" >

  <input type="text" name="reports" >
  <select id="reports" class="form-control select2me" multiple >
    <? foreach ($Balance::getSeparators() as $key => $value ) { ?>
    <option value="<?=( $key )?>"><?=( $value )?></option>
    <? } ?>
  </select>
      
</form>

このようにinput[name=reports]して、ページに正しい順序で送信されます。