Hello, First, I'd like to thank you so much for this amazing package. Please, How can I set a link into item div, so I can click on it and go to link page.

Something like this :

'item': [{
                            'title': `
                                <div class="d-flex align-items-center">
                        	        <div class="symbol symbol-success mr-3">
                        	            <img alt="Pic" src="assets/media/users/300_24.jpg" />
                        	        </div>
                        	        <div class="d-flex flex-column align-items-start">
                        	            <span class="text-dark-50 font-weight-bold mb-1">SEO Optimization</span>
                        	            <span class="label label-inline label-light-success font-weight-bold">In progress</span>
                        	        </div>
                                         **<div> <a href="link"> View </a>**
                        	    </div>
                            `,
                        },

Thanks.

Hi, i use following function to add a footer button. I want this to add a new item for that specific board but i don't have the board ID. If it can add an onclick like onclick=\"add_item('"+boardId+"') to the button it would be nice.

          itemAddOptions: {
              enabled: true,                                              // add a button to board for easy item creation
              content: '+',                                                // text or html content of the board button   
              class: 'kanban-title-button btn-block',         // default class of the button
              footer: true                                                // position the button on footer
          },

Maybe i can use this to add a footer button but this script shows only buttons in the header of the boards.

function add_title_buttons() {
  var titles = document.getElementsByClassName("kanban-title-board");
  if (titles.length == 0) {
  	return;
  }
  
  for (var column = 0; column < titles.length; column++) {
  	var currentColumn = titles[column];
    if (currentColumn.innerHTML.includes('button-add-item')) {
	    continue;
    }
    
		let boardId = currentColumn.parentElement.parentElement.dataset.id;
    let buttonAddText = "<button type=\"button\" class=\"button-add-item\" onclick=\"add_item('"+boardId+"')\">+</button>";
    currentColumn.innerHTML = currentColumn.innerHTML + buttonAddText;
  }
}

When I set the dragTo value to a board, the item callbackdrop is ignoring dragTo possible limitations. In my project, I'm allowing the items to move through the boards one at once. It's working fine, but when this is done, I have to change the status_id of this item I dragged to the next board. To accomplish this, I created an $.ajax to post the new id to that Item. The problem is: the drop callback is firing this $.ajax dispite of the board limitations (which is visually showing that the dropping are not allowed in certain boards), changing the item ID, which is not the expected behaviour. Can you help me with this? What can I be doing wrong on here? Sorry if this is not an Issue. Tell me if it's not. Thanks for this amazing work!

Regards, Jhon

Hello and thank you for your awesome library. As I can see dropEl callback fires even if item cannot be dragged to the target board (DragTo option of the source board doesn't have target board Id in it). I need to identify such situations (and don't perform all logic that is called in case of "allowed" drag). I've started with the following code but I have no idea howto read DropTo option value here (I pass an extra jKanban value in my function because I need it to find a board):

function onDropEl(jKanban, el, target, source, sibling) {
    //FIRST variant to get targetBoardId
    var targetBoardId = target.parentElement.getAttribute('data-id');

    //SECOND variant to get targetBoardId - which of two is the correct one???
    var targetBoardId2 = target.parentElement.dataset.id;

    var targetBoard = jKanban.findBoard(targetBoardId);
   //Howto read DropTo option value here??? 
  
}

How would I create a kanban item with the following structure:

Title: Present delivery
Owner: rouilj  <avatar image of rouilj>
Due date: 2020-12-25

It looks like the title property is a single line text string. I can add the owner, dueDate ownerAvatar as custom properties, but how do I get them displayed in the item/card?

Can the

customHandler       : "<span class='item_handle'>+</span> %s"// your entirely customized handler. Use %s to position item title

property be used in some way to format the item? I don't see any doc on the customHander but I assume it is meant to provide a handle to click on to start drag and drop. Otherwise the whole item/card accepts a click to drag and drop.

Hello. I have a suggestion. how about provided getALLBoards? input boardID then return all boards by JSON standard format.

When I add/update board and board's item end then update this result into API input parameter, If getALLBoards function supported, It'll be cool.

Thanks.

Hi,

Thanks for the great plugin.

We encountered a little issue. Could you please check our test video here; https://www.loom.com/share/05daa5de83c940bf9c7da306fa08e65f

We used your official example file; jkanban-1.2.0/example/index.html for this test. It will work only when page initializes in desktop mode, but not in mobile mode.

Thanks

Hi,

In our business, our items inside a board have different dragTo boards. In this case, what's the approach to use ? We've used the dropEl event to validate if user can drop using an async function but in this case, the kanban.drake.cancel(true) will not work in the callback.

Our code:

const mergedConfig = {
           ...new KanbanConfiguration(),
           ...this.configuration,
           dropEl: (el, target, source, sibling) => {
               const currentStatusId = el.getAttribute("data-boardid");
               const targetStatusId = target.parentElement.getAttribute("data-id");
              this.workflowService.getWorkflowStateTransition(currentStatusId,targetStatusId).subscribe(
                   transition => {
                        /// post to server ...............
                   },
                   error => {
                        // tried this to undo   
                       const copy = el.cloneNode(true);
                       this.kanban.addElement(currentStatusId, copy);
                       this.kanban.removeElement(el);
                   }
               );
           }
       };
       this.kanban = new jKanban(mergedConfig);

We tried to undo the drag and drop by removing and adding element to previous board but it does not work.

Thank you.

Hi !

We have to give a list of boards in order to create our jkanban. I see that this list have 2x more elements after jkanban creation than before.

For instance, if I have 5 elements in the boardJson given as "boards" parameter, after creation of jkanban I have boardJson.lenght = 10. This is not good for me because I need this list for other purpose. Duplicate boards are boring the handle.

Looking into the code, I see this " self.options.boards.push(board);" in the "addBoards" function. As boards are already in options, I think that this is unusefull and the root of my trouble.

I comment this line, and everything "seems" to work fine without this line.

Can I have your opinion on this?

Thank you!

I'm trying to cancel a drag event in order to prevent moving cards on a automatic board, but when I call jkanban.drake.cancel(true) the dragula raises an exception saying "el is null" on touchy function. Do you have any suggestion to implement a "beforeDrag" event in order to validate if a card can be moved? I'm intended to develop that on jKanban.

I noticed that when I set the dragTo property and start dragging an item, the boards not allowed to drop became brighter. But when I drop the card in the same position it was, intending to cancel move to another board, the entire kanban doesn't repaint those disabled boards. The kanban is set to dragBoards: false

Bumps qs from 6.5.2 to 6.5.3.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Bumps decode-uri-component from 0.2.0 to 0.2.2.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

I think this is good kanban plugin, but there is an issue. I added checkbox on each card of boards.

I can check/uncheck these checkbox but checkbox status is not changed. It is always showing unchecked.

please help me. thank you

When a new content that should display on the kanban is saved to db or a content on the kanban is updated, I wand to be able to trigger a function to reload the kanban items so that updated data is displayed.

Is there an available method for this or a know method to get this done?

Basically I just want to know, whenever the user has scrolled through all the items in the board and has reached to the bottom of the board. For example if you scrolled to the bottom of this board as shown in this image. https://user-images.githubusercontent.com/7257227/47652284-483d7580-db64-11e8-8444-a07ac2c81690.png