html5-kanban-column-moving.png

It is possible to change the column order using drag and drop.

Column moving is disabled by default. You can enable it using ColumnMoveHandling property.

JavaScript

<div id="dp"></div>

<script type="text/javascript">

    var dp = new DayPilot.Kanban("dp");
    dp.columns.list = [
        {name: "Analysis", id: "1", barColor: "#f9ba25"},
        {name: "Draft", id: "2"},
        {name: "Testing", id: "3"}
    ];
    dp.cards.list = [
        {id: 1, "name": "Task 1", column: "1", text: "This is a description of task #1."},
        {id: 2, "name": "Task 2", column: "1", text: "This is a description of task #2.", barColor: "#ea3624"},
    ];

    dp.columnMoveHandling = "Update";
    dp.onColumnMove = function(args) {
        dp.message("The column has been moved.");
    };
    dp.init();

</script>