[Vuejs]-How i can swap the selected options of two bootstrap-vue multiple select boxes?

by

0👍

✅

i resoved that with this code.

after posting the question, I wrote a new one from the bottom and started thinking about it again. Then I wrote the code and completed it.

I hope this method helps the people who see this question.

    moveOptionsToSelect(direction) {
      let getMovableObjects;
      if (direction === 'LTR') {
        getMovableObjects = this.inActiveOptions.filter(elm =>
          this.inActiveSelected.includes(elm.value),
        );

        this.inActiveOptions = this.inActiveOptions.filter(
          elm => !this.inActiveSelected.includes(elm.value),
        );
        this.inActiveSelected = [];

        this.activeOptions.push(...getMovableObjects);
      }
      else if (direction === 'RTL') {
        getMovableObjects = this.activeOptions.filter(elm =>
          this.activeSelected.includes(elm.value),
        );

        this.activeOptions = this.activeOptions.filter(
          elm => !this.activeSelected.includes(elm.value),
        );
        this.activeSelected = [];

        this.inActiveOptions.push(...getMovableObjects);
      }
    },

0👍

I would use 2 different arrays for the 2 selects.
Based on your direction, you could pop from the first array and push to the second one.
Note, try to use coy of the options, so it doesn’t get modified instant if you choose another option.

Leave a comment