Unable to drag element between columns in a kanban format

I am unable to grad the divs across columns. I can sort them within the same column but unable to drag them outside of the area. This is my template.

<div class="column-bodies">
          <div class="column-body" v-for="column in kanbanColumns"
             :column-id="column.id">
            <draggable v-model="flightObjects[column.text]" class="dragArea" :move="checkMove" :options="dragOptions">
              <div class="flight" v-for="flight in flightObjects[column.text]" :key="flight.id">
                <element-flight :flight="flight" :label="'kanban'"></element-flight>
              </div>
            </draggable>
          </div>
        </div>

flightObject is a computed function returning a property from data. Am I doing something wrong? Also not able to scroll while dragging an element to a column not on screen. Is that possible?

[demonmind]

I had the draggable element on the main div and not in the separate columns. Just a mistake on placement of the element.

[phaberest]

@demonmind can you please provide more information about what was the problem and how you solved it?