複数選択用の優れたドロップダウンメニューウィジェットを描画するjQueryUI複数選択ウィジェットを使用しています。
私はすでに(ユーザー名で)ソートされた次のような複数選択を持っています:
<select multiple="multiple" name="users" id="id_users">
<option value="1" selected="selected">aaa</option>
<option value="44">bbb</option>
<option value="21" selected="selected">ccc</option>
<option value="50">ddd</option>
<option value="16">eee</option>
<option value="25" selected="selected">fff</option>
</select>
また、ユーザー名の並べ替えを維持したいのですが、ユーザーがドロップダウンメニューを開くたびに、選択したアイテムをリストの一番上に移動します。したがって、この例では、新しい順序は次のようになります。
<select multiple="multiple" name="users" id="id_users">
<option value="1" selected="selected">aaa</option>
<option value="21" selected="selected">ccc</option>
<option value="25" selected="selected">fff</option>
<option value="44">bbb</option>
<option value="50">ddd</option>
<option value="16">eee</option>
</select>
ウィジェットのWebサイトから、選択したアイテムの配列を返すメソッドがあり、開く前にイベントがあることがわかります。だから、開く前にイベントを処理することで(その配列を使用して)並べ替えを管理できると思いますが、私はjavascriptにかなり慣れていないので、誰でも正しい方向に向けることができますか?
ここで検索したところ、見つけたすべての解決策が「テキストで並べ替え」の問題を解決しました(これは私が必要としているものではありません)。
編集:私はこのように解決しました:
$('#id_users').multiselect({
beforeopen: function(event, ui) {
$('#id_users option:selected').prependTo('#id_users');
$('#id_users').multiselect('refresh');
}
});
したがって、ウィジェットの初期化では、これらの2行のコードをbeforeopenイベントにバインドします。beforeopenの処理では、選択したアイテムを他のアイテムの前に追加し、ウィジェットを更新します(複数選択を一度だけ読み取るため、更新しない場合は、HTMLが変更されても順序は同じままです)。
評判が悪いので賛成できません。しかし、ありがとう!