javascript - 如何在jKanban中获取看板ID

Question

我正在使用 jKanban 制作状态列表，但我有一个问题。

我在 Stack Overflow 上搜索但找不到解决方案。这就是我打开这个问题的原因。

当我将看板中的项目移至其他看板时，如何获取该看板的 id？

默认值如下:

var kanban = new jKanban({
    element          : '',                                           // selector of the kanban container
    gutter           : '15px',                                       // gutter of the board
    widthBoard       : '250px',                                      // width of the board
    responsivePercentage: false,                                    // if it is true I use percentage in the width of the boards and it is not necessary gutter and widthBoard
    dragItems        : true,                                         // if false, all items are not draggable
    boards           : [],                                           // json of boards
    dragBoards       : true,                                         // the boards are draggable, if false only item can be dragged
    itemAddOptions: {
        enabled: false,                                              // add a button to board for easy item creation
        content: '+',                                                // text or html content of the board button   
        class: 'kanban-title-button btn btn-default btn-xs',         // default class of the button
        footer: false                                                // position the button on footer
    },    
    itemHandleOptions: {
        enabled             : false,                                 // if board item handle is enabled or not
        handleClass         : "item_handle",                         // css class for your custom item handle
        customCssHandler    : "drag_handler",                        // when customHandler is undefined, jKanban will use this property to set main handler class
        customCssIconHandler: "drag_handler_icon",                   // when customHandler is undefined, jKanban will use this property to set main icon handler class. If you want, you can use font icon libraries here
        customHandler       : "<span class='item_handle'>+</span> %title% "  // your entirely customized handler. Use %title% to position item title 
                                                                             // any key's value included in item collection can be replaced with %key%
    },
    click            : function (el) {},                             // callback when any board's item are clicked
    context          : function (el, event) {},                      // callback when any board's item are right clicked
    dragEl           : function (el, source) {},                     // callback when any board's item are dragged
    dragendEl        : function (el) {},                             // callback when any board's item stop drag
    dropEl           : function (el, target, source, sibling) {},    // callback when any board's item drop in a board
    dragBoard        : function (el, source) {},                     // callback when any board stop drag
    dragendBoard     : function (el) {},                             // callback when any board stop drag
    buttonClick      : function(el, boardId) {},                     // callback when the board's button is clicked
    propagationHandlers: [],                                         // the specified callback does not cancel the browser event. possible values: "click", "context"
})

我尝试了这个方法，但没有结果。

dropEl : function (el, target, source, sibling) {
    console.log(target);
}

Answer 1

我用它来获取目标 id 和源 id，然后计算出该项目是否已放回自身，或移动到不同的板/列。

dropEl: function(el, target, source, sibling) {
    var sourceId = $(source).closest("div.kanban-board").attr("data-id"),
        targetId = $(target).closest("div.kanban-board").attr("data-id");
    
    if(source === target) {
        // same column
    } else {
        // different column
    }
}