Chosen: Keep Multiple Selection Order

[Tomy1209]

I am using Chosen's Multiple selection with angular model. I want to be able to track user selected order. For example, if a user select option2 first then option1, I want to get the result in the order of option2 and option1. But chosen sorts user selected options. Is there a way I can tell chosen to not sorting the result?

[leocaseiro]

Hi @Tomy1209, thanks for reporting your issue.

You can use a watcher that saves all your selections. So that would be a 2nd object which would be the history of all selections.

Something like that:

 $scope.$watch('chosenValue', function() {
      history.push(newItem);
 });

[Tomy1209]

Thanks for your answer. but I'm not clear your solution. I have a plunker that describes this problem, can you help me fixed it. Thank you a lot. https://plnkr.co/edit/TnrmiHFffbItDB28855I?p=preview

[leocaseiro]

Hi @Tomy1209,

I added an array diff function and a list with your results.

Working on plunker https://plnkr.co/edit/jMECxUvAn9qUc0EgCF9i?p=preview

 $scope.selectedValues = [];

 $scope.$watch('countries', function(nowSelected, previousSelected) {
    if (!nowSelected) {
      // sometimes selected is null or undefined
      return;
    }

    var newItem = $scope.arr_diff(previousSelected, nowSelected);

    $scope.selectedValues.push(newItem);
  });

  $scope.arr_diff = function(a1, a2) {
    var a = [],
      diff = [];

    for (var i = 0; i < a1.length; i++) {
      a[a1[i]] = true;
    }

    for (var i = 0; i < a2.length; i++) {
      if (a[a2[i]]) {
        delete a[a2[i]];
      } else {
        a[a2[i]] = true;
      }
    }

    for (var k in a) {
      diff.push(k);
    }

    return diff;
  };

[Tomy1209]

Hi @leocaseiro leocaserio, I want select option3, then option 1 and option 2 so in html view will display similar, and the model i get also similar that Is there any way to fix it ?

[leocaseiro]

Sorry @Tomy1209, I'm confused.

What do you mean "display similar"?

[Tomy1209]

oh sorry, my english is not good i mean, it will display option3, option2, option1 but not option1, 2, 3

[leocaseiro]

Hi @Tomy1209, now I understand what you meant.

You want to keep the order of your chosen while you select it.

Well, unfortunately, that's not a chosen functionality, I suggest you try to implement angular-ui which does exactly what you need: https://angular-ui.github.io/ui-select/

Otherwise, we would have to change the library to https://github.com/tristanjahier/chosen-order.

[Tomy1209]

@leocaseiro, thanks for your suggestion