Sort order not maintained when moving from selected to available

[dflor003]

We are having an issue when moving items from selected to available via clicking on the '-' icon. For items towards the top of the list, it does preserve this ordering. However, if you do this for items towards the bottom, it does not. You can reproduce this on the demo page quite easily:

1. Go to the demo page: http://quasipartikel.at/multiselect/
2. Add the 3rd item from the bottom of available to selected by clicking '+' (in the case of the demo page, it's Uzbekistan)
3. Send the item back to the available section by clicking '-'

Expected behavior: Uzbekistan appears where it was originally in the available list Actual behavior: Uzbekistan get's added as the last item.

The problem seems to be in the _setSelected method in ui.multiselect.js. In the else branch for non-selected items (line 190), it indexes into the items array but the index is greater than the size of the array in this case. A possible fix would be to either always start from the top when determining the position or doing a conditional check to see if i is > than the length of items:

else { 
            // look for successor based on initial option index 
            var items = this.availableList.find('li'), comparator = this.options.nodeComparator; 
            var succ = null, i = /*item.data('idx')*/0, direction = comparator(item, $(items[i])); 

            // TODO: test needed for dynamic list populating 
            if (direction) { 

[elavelle]

Are you suggesting this as a fix? Setting i to 0 doesn't make any difference for me (tried on Christopher Deutsch's branch, line 296, https://github.com/crdeutsch/multiselect).

[elvetemedve]

I have the same issue with Hungarian language. A possible solution is to define a custom node comparator like this one:

$('select').multiselect({
    nodeComparator: function(node1, node2) {
          return node1.data('idx') == node2.data('idx') ? 0 : (node1.data('idx') < node2.data('idx') ? -1 : 1);
    }
}