0

I am trying to drag same array to array Please check my code and let me where i am doing wrong. Worked almost for 10 hours but didn't figure-out any solution. Appreciate for your help.

    <draggable v-model="userSkillLevel3"
                           :options="{group:'people',animation:150,filter: '.ignore-elements',preventOnFilter: true,dragClass:'sortable-chosen',handle: '.sortable-chosen',chosenClass:'sortable-chosen',ghostClass: 'sortable-ghost'}"
                           @change="sortSkill($event,userSkillLevel2)">
                    <div class="sortable-ghost">
                        <div class="ignore_element">
                            <input id="entry_level2" type="radio" name="expertlevel" value="2" v-on:click="updateSkillLevel(2)">
                            <label for="entry_level2"><span>$</span> Expert</label>
                        </div>

                        <div class="resultshow ">
                            <draggable v-model="userSkillLevel3"
                                       :options="{group:'people',animation:150}"  >
                                <ul v-for="(userSkillLevel,index) in userSkillLevel3" :key="index" class="">
                                    <li class=" sortable-chosen"><span class="">{{userSkillLevel.name}} <i v-on:click="clearCurrentSkillLevel(''+userSkillLevel.code+'')" class="fa fa-close"></i></span></li>
                                </ul>
                            </draggable>
                        </div>
                    </div>

                </draggable>
Rajan
  • 13
  • 7

1 Answers1

0

I think the problem is that you should not duplicate your draggable item. Even worse that you use the same v-model attribute with them because the models will be messed up like this. You should use one draggable item WITHOUT specifying the pull and put options because your code implies that you don't want to let the items be pulled from your array. If you check the GitHub of the plugin, you can see that the most basic example is dragging from and dropping into the same array:

https://github.com/SortableJS/Vue.Draggable

Máté Wiszt
  • 396
  • 2
  • 13
  • Thank you for your response please check my code again updated with new code. please let me know your thoughts. – Rajan Aug 27 '18 at 08:27
  • Sorry, maybe I did not understand the problem. You have one array and you want to drag and drop elements only inside it (practically only change the order of the elements) or something else? I still don't understand why you nest draggable items into each other. – Máté Wiszt Aug 27 '18 at 08:36