Sorting not working when only plus button is used

[frazao]

Hi,

When i only select the elemenst by using the plus(+) button, my list is not sorted by the way i clicked them when i POST it using a form.

For example, my list is: A B C D

I click plus on the D and then A. The selected list is now: D A.

But if i go post this onto another page via a web form my list goes back to original placement like this: A D instead of D A as i selected.

However if i play with them up or down, by dragging them, it works.

I try using the code above, but it didn't work. Is there any workaround on this?

Thanks

[verbeek]

I have the same issue. Did you already find the solution? Or somebody else?

I use the following:

$.widget("ui.multiselect", { options: { sortable: true, searchable: true, animated: 'fast', show: 'slideDown', hide: 'slideUp', dividerLocation: 0.6, nodeComparator: function(node1,node2) { var text1 = node1.text(), text2 = node2.text(); return text1 == text2 ? 0 : (text1 < text2 ? -1 : 1); } }

Maybe it's a wrong option I selected. Help please.

[frazao]

Nope...

i still can't make it work.

On Wed, Mar 16, 2011 at 9:13 AM, verbeek < reply@reply.github.com>wrote:

I have the same issue. Did you already find the solution? Or somebody else?

I use the following:

$.widget("ui.multiselect", { options: { sortable: true, searchable: true, animated: 'fast', show: 'slideDown', hide: 'slideUp', dividerLocation: 0.6, nodeComparator: function(node1,node2) { var text1 = node1.text(), text2 = node2.text(); return text1 == text2 ? 0 : (text1 < text2 ? -1 : 1); } }

Maybe it's a wrong option I selected. Help please.

Reply to this email directly or view it on GitHub: https://github.com/michael/multiselect/issues/69#comment_879722

[verbeek]

Find it: adjust the following in ui.multiselect.js _setSelected: function(item, selected) { item.data('optionLink').attr('selected', selected);

    if (selected) {
        var selectedItem = this._cloneWithData(item);
        item[this.options.hide](this.options.animated, function() { $(this).remove(); });
        selectedItem.appendTo(this.selectedList).hide()[this.options.show](this.options.animated);

        this._applyItemState(selectedItem, true);
    return selectedItem;

with:

_setSelected: function(item, selected) { item.data('optionLink').attr('selected', selected);

    if (selected) {
        var selectedItem = this._cloneWithData(item);
        item[this.options.hide](this.options.animated, function() { $(this).remove(); });
        selectedItem.appendTo(this.selectedList).hide()[this.options.show](this.options.animated);

        this._applyItemState(selectedItem, true);

        if (this.options.sortable) {
      var that = this;
      // apply the new sort order to the original selectbox
      that.selectedList.find('li').each(function() {
          if ($(this).data('optionLink'))
              $(this).data('optionLink').remove().appendTo(that.element);
      });
  }

        return selectedItem;

But this brings me to the next problem. I save the order in a database but when i call the selected items for adjustements I can't recall the selected order. How do is populated the selected part in the order i want? list is for example A B C and I saved C B in that order. When I call that order back it displays B C and not C B. Can anybody help me with this problem?

[trompetix]

Thank you verbeek. That helped me a lot!

Maybe that helps your problem: If you create the select-tag with the options in your desired order (i.e. first B than C) and mark them with selected="selected" they should be displayed in correct order in the multiselect-box

[JonDavies]

Thanks for the fix - it's an important bug; showstopper for sorting.