Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New Option: Sortable #221

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open

New Option: Sortable #221

wants to merge 7 commits into from

Conversation

Mactory
Copy link

@Mactory Mactory commented Mar 15, 2016

Adding the ability to sort the selected elements (As requested in #171 ). This requires jQueryUI to be loaded. If it is not loaded, the sortable option is automatically deactivated and a corresponding warning is issued.

Tim Schneider added 2 commits March 15, 2016 11:47
jQueryUI is required for this. If it is not loaded, the sortable option will be deactivated automatically.
# Conflicts:
#	js/jquery.multi-select.js
@peterfarrell
Copy link

We are very interested in seeing this PR merged in. We are currently using the fork version by the original PR submitter. Thank you so much @Mactory !

@christianmagill
Copy link

Is this fork still available.

@peterfarrell
Copy link

@christianmagill We took the changes from here: https://github.com/NB-Dev/multi-select/

@christianmagill
Copy link

Much thanks!

@Mactory
Copy link
Author

Mactory commented Jul 25, 2016

I merged the newest upstream master into my repo as this PR has not yet been merged.
@lou Is there anything I can do or you want me to change to get this PR merged?

@peterfarrell
Copy link

@Mactory thanks for updating your PR. Really looking forward for this to get into master.

@christianmagill
Copy link

@Mactory, This PR suffers from a jQuery UI Sortable bug in Firefox (Mac/Win). Dragging and releasing sends a click which in this context unselects the dragged selection.

Apparently the solution is to use the Sortable option

helper : 'clone'

I have yet to confirm this fix.

christianmagill and others added 2 commits August 9, 2016 14:56
This commit solves an issue with jQuery UI where dragging an item causes a click event which results in the item being deselected.
jQuery UI Sortable "Clone" Helper for Firefox Issues.
@carlhussey
Copy link

Is there a way to style the handle / cursor on the selection side only? I want to keep the pointer on the left but on the right, when sorting is available, id like it to be a move icon.

@Mactory
Copy link
Author

Mactory commented Oct 18, 2016

@carlhussey Yes, you can use CSS for this:
.ms-container .ms-list.ui-sortable > li {cursor: move;}
@ALL Do you think this should this be integrated into the pull-request?

@peterfarrell
Copy link

@Mactory I think that seems to be a reasonable addition.

@alani1
Copy link

alani1 commented Nov 6, 2016

@Mactory does this also fire an event when the order is changed? Similar to afterSelect and afterDeselect it would be great to have an afterSort.

@Mactory
Copy link
Author

Mactory commented Nov 7, 2016

@alani1: Currently the sortable option does not fire a custom event. I use jQueryUI for the sortable option though, which fires a range of events: http://api.jqueryui.com/sortable/
They should be fired on the .ms-selection > ul.ms-list element or your multi-select.

@abscond784
Copy link

Any news on this getting merged into master? @lou ?

@chrisbartolo
Copy link

@Mactory I'm having some issues when loading the data... Basically the order is not kept when loading the data to it. Any suggestions on how to resolve this? Thanks!

@Mactory
Copy link
Author

Mactory commented Aug 22, 2017

@chrisbartolo For me, the order of elements are kept. Can you send me a code snippet? I might be able to help you then.

@Cdat24
Copy link

Cdat24 commented Dec 6, 2017

Hello, I'm new to GitHub... But, I wanted to know if the issue regarding the sortable option returning the sorted order as an array? Any info would be appreciated.

Regards,
Cdat24

@Mactory
Copy link
Author

Mactory commented Dec 7, 2017

For the multi-select the values are POSTed as an array. The array is ordered in the order that is selected in the widget.

@Cdat24
Copy link

Cdat24 commented Dec 7, 2017

Right, I understand that. I guess what I'm getting at is, is there a way to reset or create a new array based on the values after sorting? Thanks for replying. Please forgive confusion on my behalf.

@Mactory
Copy link
Author

Mactory commented Dec 7, 2017

No worries. I am still unsure what you need though. Do you want one array in the original order and one in the new, sorted order?

@Cdat24
Copy link

Cdat24 commented Dec 7, 2017

My apologies, the new sorted order is what I mean.

Regards,
Cdat

@Mactory
Copy link
Author

Mactory commented Dec 7, 2017

that is exactly what you should get with the sortable option enabled. Under the hood, the plugin re-orders the <option> elements within the <select> element to match the ordering in the widget. The browser then sends the array in the order of the option elements when submitting the form. Or do you need the ordered values in javascript?

@christianmagill
Copy link

@Mactory Any suggestions if you need to reload the page with the same sorting in place? I know I could switch the output order of the options, but then the original side would be out of order as options get put disabled.

@christianmagill
Copy link

This is what I ended up with.. Could probably use some cleanup.

 afterInit: function (ms) {

                var that = this;
                var values = that.$element.attr('data-selected').split(',');

                var reverse = function (array) {
                    var arrayOne = array
                    var array2 = [];

                    for (var i = arrayOne.length - 1; i >= 0; i--) {
                        array2.push(arrayOne[i])
                    }
                    return array2
                }

                var reversedValues = reverse(values);

                $.each(reversedValues, function (index, value) {
                    that.$element.prepend($select.find('option[value="' + value + '"]'));
                    that.$selectionUl.find('.ms-selected').each(function () {
                        if ($(this).data('ms-value') == value) {
                            that.$selectionUl.prepend($(this));
                            return false;
                        }
                    });
                });
            },

@senthilkumarmohan
Copy link

Adding the ability to sort the selected elements (As requested in #171 ). This requires jQueryUI to be loaded. If it is not loaded, the sortable option is automatically deactivated and a corresponding warning is issued.

This was helpful. Thankyou.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

9 participants