4

複数選択用の優れたドロップダウンメニューウィジェットを描画する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が変更されても順序は同じままです)。

評判が悪いので賛成できません。しかし、ありがとう!

4

1 に答える 1

4

これを試して。

$('#id_users option:selected').prependTo('#id_users')

于 2012-09-06T10:12:51.403 に答える